.bql-applications, .bql-catalogue__header, .bql-catalogue__products, .bql-product-page { padding-block: clamp(3rem, 7vw, 7rem); }
.bql-catalogue h1 { max-width: 14ch; font-size: clamp(2.5rem, 6vw, 5rem); line-height: .98; }
.bql-catalogue__header > p:last-child { max-width: 62ch; color: var(--bql-ink-soft); font-size: 1.125rem; line-height: 1.6; }
.bql-application-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1rem; padding: 0; list-style: none; }
.bql-application-list li { padding: 1.25rem; border-top: 2px solid var(--bql-accent); background: var(--bql-mist); font-weight: 700; }

.bql-hero-story {
    --bql-museum-opacity: 1;
    --bql-museum-scale: 1;
    --bql-museum-blur: 0;
    --bql-pool-opacity: 0;
    --bql-pool-scale: 1;
    --bql-pool-blur: 0;
    --bql-pool-reveal-edge: 50%;
    --bql-yacht-opacity: 0;
    --bql-yacht-scale: 1.025;
    --bql-yacht-clip: ellipse(18% 8% at 62% 105%);
    --bql-museum-copy: 1;
    --bql-pool-copy: 0;
    --bql-yacht-copy: 0;
    --bql-warm-bloom: 0;
    --bql-reflection: 0;
    --bql-progress: 0;
    position: relative;
    height: 640vh;
    background: #101313;
}

.bql-hero-stage {
    position: sticky;
    z-index: 1;
    top: 0;
    height: 100vh;
    height: 100svh;
    min-height: 38rem;
    overflow: hidden;
    isolation: isolate;
    background: #111515;
    color: #fff;
}

.bql-hero-stage::before,
.bql-hero-stage::after,
.bql-hero-stage__ambient {
    position: absolute;
    z-index: 5;
    inset: 0;
    content: "";
    pointer-events: none;
}

.bql-hero-stage::before {
    opacity: var(--bql-warm-bloom);
    background: radial-gradient(circle at 49% 47%, rgba(236, 187, 112, .7) 0, rgba(198, 126, 62, .23) 20%, transparent 52%);
    mix-blend-mode: screen;
}

.bql-hero-stage::after {
    inset: auto -10% -20% 20%;
    height: 55%;
    opacity: var(--bql-reflection);
    transform: skewX(-12deg) scaleX(.9);
    transform-origin: 50% 100%;
    border-radius: 50% 50% 0 0;
    background: linear-gradient(165deg, transparent 10%, rgba(170, 211, 206, .28) 48%, rgba(231, 188, 122, .12) 68%, transparent 82%);
    filter: blur(10px);
}

.bql-hero-stage__ambient {
    z-index: 4;
    background: linear-gradient(90deg, rgba(7, 10, 10, .74) 0%, rgba(7, 10, 10, .38) 34%, transparent 68%), linear-gradient(0deg, rgba(5, 8, 8, .48) 0%, transparent 42%);
}

.bql-hero-scene,
.bql-hero-scene__media,
.bql-hero-scene__media img,
.bql-hero-scene__media video {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.bql-hero-scene { overflow: hidden; }
.bql-hero-scene--museum { z-index: 1; opacity: var(--bql-museum-opacity); transform: scale(var(--bql-museum-scale)); filter: blur(var(--bql-museum-blur)); }
.bql-hero-scene--pool { z-index: 2; opacity: var(--bql-pool-opacity); clip-path: inset(0 var(--bql-pool-reveal-edge) 0 var(--bql-pool-reveal-edge)); transform: scale(var(--bql-pool-scale)); filter: blur(var(--bql-pool-blur)); }
.bql-hero-scene--yacht { z-index: 3; opacity: var(--bql-yacht-opacity); clip-path: var(--bql-yacht-clip); transform: scale(var(--bql-yacht-scale)); }

.bql-hero-scene__media img,
.bql-hero-scene__media video {
    display: block;
    object-fit: cover;
    object-position: center;
}

.bql-hero-scene__media video { z-index: 1; }
.bql-hero-scene__media img { z-index: 0; }
.bql-hero-video--failed { display: none; }

.bql-hero-copy {
    --bql-eyebrow-opacity: 1;
    --bql-eyebrow-shift: 0;
    --bql-heading-opacity: 1;
    --bql-heading-shift: 0;
    --bql-support-opacity: 1;
    --bql-support-shift: 0;
    --bql-actions-opacity: 1;
    --bql-actions-shift: 0;
    position: absolute;
    z-index: 6;
    top: 50%;
    left: max(1.25rem, calc((100vw - 1180px) / 2));
    width: min(42rem, calc(100% - 2.5rem));
    transform: translateY(-48%);
    opacity: var(--bql-copy-opacity);
    text-wrap: balance;
}

.bql-hero-scene--museum .bql-hero-copy { --bql-copy-opacity: var(--bql-museum-copy); }
.bql-hero-scene--pool .bql-hero-copy { --bql-copy-opacity: var(--bql-pool-copy); }
.bql-hero-scene--yacht .bql-hero-copy { --bql-copy-opacity: var(--bql-yacht-copy); }

.bql-hero-copy__eyebrow {
    margin: 0 0 .9rem;
    color: #e6bd83;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
    opacity: var(--bql-eyebrow-opacity);
    transform: translateY(var(--bql-eyebrow-shift));
}

.bql-hero-copy h1,
.bql-hero-copy h2 {
    max-width: 12ch;
    margin: 0;
    color: #fff;
    font-size: clamp(2.75rem, 6.2vw, 6.5rem);
    font-weight: 500;
    letter-spacing: -.045em;
    line-height: .94;
    opacity: var(--bql-heading-opacity);
    transform: translateY(var(--bql-heading-shift));
}

.bql-hero-copy > p:not(.bql-hero-copy__eyebrow) {
    max-width: 39rem;
    margin: 1.35rem 0 0;
    color: rgba(255, 255, 255, .82);
    font-size: clamp(1rem, 1.35vw, 1.18rem);
    line-height: 1.58;
    text-wrap: pretty;
    opacity: var(--bql-support-opacity);
    transform: translateY(var(--bql-support-shift));
}

.bql-hero-actions { display: flex; flex-wrap: wrap; gap: 1rem 1.35rem; align-items: center; margin-top: 1.75rem; opacity: var(--bql-actions-opacity); transform: translateY(var(--bql-actions-shift)); }
.bql-button--light { border-color: #f4efe6; background: #f4efe6; color: #172126; }
.bql-button--light:hover, .bql-button--light:focus-visible { border-color: #e6bd83; background: #e6bd83; color: #172126; }
.bql-text-link { padding: .65rem 0; border-bottom: 1px solid rgba(255, 255, 255, .55); color: #fff; font-weight: 700; text-decoration: none; }
.bql-text-link:hover, .bql-text-link:focus-visible { border-color: #e6bd83; color: #e6bd83; }
.bql-hero-actions a:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }

.bql-hero-progress {
    position: absolute;
    z-index: 7;
    right: max(1.25rem, calc((100vw - 1180px) / 2));
    bottom: 2rem;
    display: grid;
    grid-template-columns: repeat(3, auto);
    gap: 1rem;
    align-items: center;
    color: rgba(255, 255, 255, .66);
    font-size: .65rem;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.bql-hero-progress i {
    position: absolute;
    right: 0;
    bottom: -.65rem;
    left: 0;
    height: 2px;
    transform: scaleX(var(--bql-progress));
    transform-origin: 0 50%;
    background: #e6bd83;
}

@media (max-width: 47.99rem), (pointer: coarse) and (max-height: 56rem) {
    .bql-hero-story { height: auto; background: #101313; }
    .bql-hero-stage { position: relative; height: auto; min-height: 0; overflow: visible; }
    .bql-hero-stage::before, .bql-hero-stage::after, .bql-hero-stage__ambient, .bql-hero-progress { display: none; }
    .bql-hero-scene { position: relative; min-height: min(46rem, 100svh); opacity: 1; transform: none; filter: none; clip-path: none; }
    .bql-hero-scene__media::after { position: absolute; z-index: 2; inset: 0; content: ""; background: linear-gradient(0deg, rgba(5, 8, 8, .84), rgba(5, 8, 8, .08) 70%); }
    .bql-hero-scene__media video { display: none; }
    .bql-hero-copy { top: auto; bottom: 2rem; left: 1.25rem; width: calc(100% - 2.5rem); transform: none; opacity: 1; }
    .bql-hero-copy__eyebrow, .bql-hero-copy h1, .bql-hero-copy h2, .bql-hero-copy > p:not(.bql-hero-copy__eyebrow), .bql-hero-actions { opacity: 1; transform: none; }
    .bql-hero-copy h1, .bql-hero-copy h2 { max-width: 13ch; font-size: clamp(2.3rem, 11vw, 4rem); }
    .bql-hero-copy > p:not(.bql-hero-copy__eyebrow) { font-size: 1rem; line-height: 1.48; }
    .bql-hero-actions { margin-top: 1.25rem; }
}

@media (prefers-reduced-motion: reduce) {
    .bql-hero-story { height: auto; }
    .bql-hero-stage { position: relative; height: auto; min-height: 0; overflow: visible; }
    .bql-hero-stage::before, .bql-hero-stage::after, .bql-hero-stage__ambient, .bql-hero-progress { display: none; }
    .bql-hero-scene { position: relative; min-height: min(46rem, 100svh); opacity: 1; transform: none; filter: none; clip-path: none; }
    .bql-hero-scene__media::after { position: absolute; z-index: 2; inset: 0; content: ""; background: linear-gradient(0deg, rgba(5, 8, 8, .84), rgba(5, 8, 8, .08) 70%); }
    .bql-hero-scene__media video { display: none; }
    .bql-hero-copy { top: auto; bottom: 2rem; transform: none; opacity: 1; }
    .bql-hero-copy__eyebrow, .bql-hero-copy h1, .bql-hero-copy h2, .bql-hero-copy > p:not(.bql-hero-copy__eyebrow), .bql-hero-actions { opacity: 1; transform: none; }
}