/* Marketing choreography. Native scrolling; product controls never move with the story. */
.home-page .hero-rotator { display: grid; max-width: 14ch; }
.home-page .hero-slide { grid-area: 1 / 1; align-self: start; visibility: hidden; opacity: 0; pointer-events: none; }
.home-page .hero-slide.is-current { visibility: visible; opacity: 1; }
.home-page .hero-line { text-wrap: balance; }
.home-page .hero-lens { position: absolute; inset: 0; transform: scale(1.015); transform-origin: 74% 62%; transition: transform var(--dur-slow) var(--ease-out); }
.home-page .hero-lens > img { position: absolute; top: -48px; left: 0; width: 100%; height: calc(100% + 96px); object-position: 75% center; filter: contrast(1.05); }
.home-page .landing-cta-backdrop > img { filter: contrast(1.05); }
.home-page .hero-aside { position: relative; }
.home-page .hero-aside-label { display: flex; justify-content: space-between; gap: 1rem; transition: transform var(--dur-base) var(--ease-out); }
.home-page .aside-arrow { display: inline-block; transition: transform var(--dur-base) var(--ease-out); }
.home-page .hero-aside p { transition: opacity var(--dur-base) var(--ease-out); }
.home-page .scroll-cue-line { transform-origin: left; transition: transform var(--dur-base) var(--ease-out); }
.home-page .hero-motion-toggle { display: inline-flex; align-items: center; gap: 0.75rem; min-height: 44px; padding: 0.5rem 0; background: transparent; border: 0; color: var(--muted); font: inherit; letter-spacing: inherit; text-transform: uppercase; cursor: pointer; }
.home-page .hero-motion-toggle:hover { color: var(--signal); }

/* The case stays in its own gutter so it never covers copy or purchase controls. */
.home-page .story-journey { position: relative; }
.home-page .scroll-companion { position: fixed; z-index: 3; inset: 0 0 0 auto; width: 8rem; opacity: 0; pointer-events: none; transition: opacity var(--dur-base) var(--ease-out); }
.home-page .scroll-companion img { position: absolute; top: 0; left: 0; width: 100%; height: auto; filter: drop-shadow(0 1rem 1rem var(--color-black-shadow)); }
.home-page .companion-rail { position: absolute; top: 24vh; bottom: 25vh; left: 50%; width: 1px; background: linear-gradient(transparent, var(--line), transparent); }
.home-page .scroll-companion > span { position: absolute; right: 1.1rem; bottom: 7rem; writing-mode: vertical-rl; font: 500 0.55rem var(--font-mono); color: var(--color-muted-deep); letter-spacing: 0.18em; }
@media (min-width: 1201px) and (prefers-reduced-motion: no-preference) {
    .home-page .story-journey > .page-gutter,
    .home-page .story-journey > section > .page-gutter { padding-right: calc(var(--page-gutter) + 6rem); }
}

/* The route changes as its photograph passes through the viewport. */
.home-page .route-overlay { pointer-events: auto; }
.home-page .route-vector { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.home-page .route-vector path { fill: none; stroke: var(--signal); stroke-width: 1; stroke-dasharray: 4 5; opacity: 0.6; }
.home-page .route-node { min-height: 44px; padding: 0.6rem; cursor: pointer; border-color: var(--line-strong); color: var(--paper); background: var(--ink-glass, var(--color-ink-glass)); }
.home-page .route-node.is-active { background: var(--signal); border-color: var(--signal); color: var(--ink); }
.home-page .node-warehouse { left: 15%; top: 48%; bottom: auto; transform: translate(-50%, -50%); }
.home-page .node-pickup { left: 49%; top: 57%; bottom: auto; transform: translate(-50%, -50%); }
.home-page .node-delivery { left: 83%; right: auto; top: 68%; bottom: auto; transform: translate(-50%, -50%); }
.home-page .route-traveler { position: absolute; top: 0; left: 0; width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--paper); box-shadow: 0 0 1rem var(--signal); pointer-events: none; }
.home-page .route-tip { position: absolute; left: 1.25rem; top: 1.25rem; width: min(24rem, calc(100% - 2.5rem)); padding: 1rem; background: var(--color-ink-glass); border-left: 2px solid var(--signal); pointer-events: none; }
.home-page .route-tip-label { color: var(--muted); font: 400 0.58rem var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; }
.home-page .route-tip p { margin: 0.5rem 0 0; color: var(--muted); font-size: 0.75rem; line-height: 1.45; }
.home-page .route-tip strong { display: block; color: var(--paper); font-size: 0.9rem; margin-bottom: 0.3rem; }
.home-page .route-scene .image-stamp { top: auto; bottom: 1rem; }

/* Studio: the stationary slots define the final layout; only their contents move. */
.home-page .services-section.service-chapter { display: block; padding: 0; }
.home-page .service-stage { display: grid; grid-template-columns: minmax(0, .8fr) minmax(18rem, 1fr) minmax(0, .8fr); grid-template-areas: 'copy art list'; align-items: center; gap: clamp(2rem, 6vw, 6rem); padding-block: clamp(4.5rem, 8vw, 8rem); }
.home-page .service-art-slot { grid-area: art; position: relative; z-index: 2; }
.home-page .service-stage .service-copy { grid-area: copy; position: relative; z-index: 1; }
.home-page .service-stage .service-list { grid-area: list; position: relative; z-index: 1; }
.home-page .service-stage .service-object { transform-origin: center; }
.home-page .studio-scroll-controls { display: flex; align-items: center; justify-content: space-between; gap: .75rem; min-height: 3.5rem; padding-top: .75rem; color: var(--muted); font: 400 .58rem var(--font-mono); text-transform: uppercase; letter-spacing: .04em; }
.home-page .studio-scroll-controls > span > span { color: var(--signal); margin-left: .4rem; }
.home-page .studio-scroll-controls button { border: 0; padding: .5rem 0 .5rem .5rem; min-height: 44px; background: transparent; color: var(--paper); font: inherit; text-transform: inherit; cursor: pointer; }
.home-page .studio-scroll-controls button:hover { color: var(--signal); }
.home-page .studio-scroll-controls button:focus-visible { outline: 2px solid var(--signal); outline-offset: 4px; }
.home-page .studio-scroll-controls:focus-within { opacity: 1 !important; pointer-events: auto !important; }
@media (min-width: 1101px) and (min-height: 760px) {
    .home-page .is-studio-scroll .service-stage { padding-block: clamp(2rem, 3vw, 3rem); }
    .home-page .is-studio-scroll:not(.is-studio-overflow) { min-height: calc(175svh - var(--banner-height)); }
    .home-page .is-studio-scroll:not(.is-studio-overflow) .service-stage { position: sticky; top: var(--banner-height); min-height: calc(100svh - var(--banner-height)); }
}
@media (max-width: 1100px) {
    .home-page .service-stage { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-areas: 'art copy' 'list list'; gap: 3rem; }
}
@media (max-width: 760px) {
    .home-page .service-stage { grid-template-columns: 1fr; grid-template-areas: 'art' 'copy' 'list'; gap: 2.5rem; }
}
.home-page.is-keyboard-input [data-studio-fragment],
.home-page .service-chapter:focus-within [data-studio-fragment] { transform: none !important; opacity: 1 !important; pointer-events: auto !important; }
.home-page.is-keyboard-input [data-studio-art],
.home-page .service-chapter:focus-within [data-studio-art] { transform: none !important; }
@media (prefers-reduced-motion: reduce), (max-width: 1100px), (max-height: 759px) {
    .home-page [data-studio-fragment] { transform: none !important; opacity: 1 !important; pointer-events: auto !important; }
    .home-page [data-studio-art] { transform: none !important; }
    .home-page .studio-scroll-controls { display: none; }
}

/* Community releases are part of the offer, not a fabricated free product listing. */
.home-page .free-scripts-section { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(2rem, 8vw, 8rem); align-items: center; padding-block: clamp(5rem, 9vw, 9rem); background: var(--gradient-section); border-bottom: 1px solid var(--line); }
.home-page .free-scripts-title h2 { margin: 0; font-size: clamp(3.25rem, 6vw, 7rem); }
.home-page .free-scripts-title h2 span { color: var(--signal); }
.home-page .free-scripts-copy { max-width: 33rem; }
.home-page .free-scripts-copy .body-muted { margin-bottom: 1.75rem; }
.home-page .free-scripts-note { margin: 1.25rem 0 0; color: var(--muted); font: 400 .65rem / 1.6 var(--font-mono); }
.home-page .free-scripts-section { row-gap: 3.5rem; }
.home-page .free-scripts-catalog { grid-column: 1 / -1; min-width: 0; }
.home-page .free-scripts-catalog-heading { display: flex; justify-content: space-between; align-items: baseline; flex-wrap: wrap; gap: 1rem; }
.home-page .free-scripts-catalog-heading h3 { margin: 0; color: var(--paper); font: 600 clamp(2rem, 3vw, 3rem) / 1.1 var(--font-display); text-transform: uppercase; }
.home-page .free-scripts-preview-note { margin: 1rem 0 1.75rem; color: var(--muted); font-size: var(--text-sm); line-height: 1.6; }
@media (max-width: 760px) {
    .home-page .free-scripts-section { grid-template-columns: 1fr; gap: 2rem; }
    .home-page .free-scripts-title h2 { font-size: clamp(3.25rem, 12vw, 5.5rem); }
}

/* More of the product story, not invented popularity rankings. */
.home-page .product-story-section { padding-block: clamp(4.5rem, 8vw, 8rem); background: var(--gradient-page); border-block: 1px solid var(--line); }
.home-page .product-story-section .section-heading-row { margin-bottom: 3rem; }
.home-page .product-story-section .section-heading-row > p { max-width: 36ch; }
.home-page .product-story-section .accent-word { color: var(--signal); }
.home-page .product-spotlight { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); border: 1px solid var(--line); background: var(--gradient-panel); }
.home-page .spotlight-art { position: relative; min-height: 34rem; overflow: clip; display: grid; place-items: center; text-decoration: none; }
.home-page .spotlight-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, var(--ink), transparent 65%); pointer-events: none; }
.home-page .spotlight-environment { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1); opacity: 0.4; }
.home-page .spotlight-cover { position: relative; z-index: 1; width: 78%; height: auto; border: 1px solid var(--line-strong); box-shadow: var(--shadow-panel); transform: rotate(-4deg); transition: transform var(--dur-slow) var(--ease-out); }
.home-page .spotlight-art-label { position: absolute; z-index: 2; bottom: 1.5rem; left: 1.5rem; right: 1.5rem; font: 400 0.65rem var(--font-mono); letter-spacing: 0.07em; color: var(--muted); text-transform: uppercase; }
.home-page .spotlight-copy { align-self: center; padding: clamp(1.5rem, 4vw, 4rem); }
.home-page .spotlight-copy h3 { margin: 1.5rem 0; color: var(--paper); font: 600 clamp(3rem, 5vw, 5.5rem) / 0.95 var(--font-display); letter-spacing: -0.03em; text-transform: uppercase; }
.home-page .spotlight-copy .body-muted { font-size: var(--text-sm); }
.home-page .spotlight-price { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin: 2rem 0; font-family: var(--font-mono); }
.home-page .spotlight-price strong { color: var(--signal); font-size: 1.15rem; }
.home-page .spotlight-price span { color: var(--muted); font-size: 0.6rem; text-transform: uppercase; }
.home-page .spotlight-copy > .text-link { display: flex; margin-top: 1.25rem; }
.home-page .workshop-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 4rem; padding-bottom: 1rem; }
.home-page .workshop-heading .section-kicker { margin: 0; }
.home-page .workshop-heading > span { color: var(--muted); font-size: var(--text-xs); }
.home-page .workshop-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.5rem; }
.home-page .workshop-item { display: flex; flex-direction: column; gap: 1.25rem; min-width: 0; padding: 0 0 1.5rem; text-decoration: none; border-bottom: 1px solid var(--line); }
.home-page .workshop-item-media { aspect-ratio: 16 / 10; overflow: clip; background: var(--ink-soft); border: 1px solid var(--line); }
.home-page .workshop-item-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur-slow) var(--ease-out); }
.home-page .workshop-item:focus-visible { outline: 2px solid var(--signal); outline-offset: 6px; }
.home-page .workshop-item-top { display: flex; align-items: center; gap: 1rem; color: var(--muted); font: 400 0.6rem var(--font-mono); text-transform: uppercase; }
.home-page .workshop-item-top span:last-child { margin-left: auto; color: var(--signal); }
.home-page .workshop-item h3 { margin: 0; color: var(--paper); font: 600 clamp(2rem, 3vw, 3rem) / 1 var(--font-display); text-transform: uppercase; }
.home-page .workshop-item p { margin: 0; color: var(--muted); font-size: var(--text-sm); line-height: 1.6; }
.home-page .workshop-item-link { margin-top: auto; color: var(--signal); font: 500 0.65rem var(--font-mono); text-transform: uppercase; }
.home-page .workshop-item:hover h3 { color: var(--signal); }

/* A final product return before the community chapter. Existing catalogue filters stay separate. */
.home-page .closing-products-section { padding-block: clamp(4.5rem, 7vw, 7rem); background: var(--gradient-page); border-block: 1px solid var(--line); }
.home-page .closing-products-section .section-heading-row { align-items: end; margin-bottom: 2.5rem; }
.home-page .closing-products-section .display-heading > span { color: var(--signal); }
.home-page .closing-product-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.home-page .closing-product-card .package-meta span:first-child { color: var(--signal); }
.home-page .closing-product-card .package-buy-row { flex-wrap: wrap; gap: .5rem 1rem; }
.home-page .closing-product-card .package-buy-row .text-link { display: inline-flex; align-items: center; min-height: 44px; font-size: .65rem; }
.home-page .closing-product-card .package-price { font-size: .85rem; }
@media (max-width: 1000px) {
    .home-page .closing-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .home-page .closing-product-grid { grid-template-columns: minmax(0, 1fr); }
    .home-page .closing-products-section .section-heading-row { align-items: start; }
}

@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .home-page:not(.is-keyboard-input) .landing-hero:has(.hero-aside:hover) .hero-lens { transform: scale(1.045); }
    .home-page:not(.is-keyboard-input) .hero-aside:hover .hero-aside-label { transform: translate3d(0, -3px, 0); }
    .home-page:not(.is-keyboard-input) .hero-aside:hover .aside-arrow { transform: translate3d(3px, -3px, 0); }
    .home-page:not(.is-keyboard-input) .hero-aside:hover .scroll-cue-line { transform: scaleX(1.25); }
    .home-page .hero-aside:hover p { opacity: 1; color: var(--paper); }
    .home-page:not(.is-keyboard-input) .spotlight-art:hover .spotlight-cover { transform: rotate(0) scale(1.025); }
    .home-page:not(.is-keyboard-input) .workshop-item:hover .workshop-item-media img { transform: scale(1.025); }
}
@media (max-width: 1200px) {
    .home-page .scroll-companion { display: none; }
}
@media (max-width: 760px) {
    .home-page .hero-rotator { max-width: 100%; font-size: clamp(3.5rem, 15vw, 6.25rem); }
    .home-page .hero-lens img { object-position: 69% center; }
    .home-page .hero-footer { position: relative; display: flex; padding-bottom: 1rem; bottom: auto; }
    .home-page .hero-footer > span { display: none; }
    .home-page .hero-motion-toggle { margin-left: auto; }
    .home-page .product-spotlight { grid-template-columns: 1fr; }
    .home-page .spotlight-art { min-height: 23rem; }
    .home-page .spotlight-copy { padding-block: 2.5rem; }
    .home-page .workshop-heading { display: block; }
    .home-page .workshop-heading > span { display: block; margin-top: 0.75rem; }
    .home-page .workshop-grid { grid-template-columns: 1fr; }
    .home-page .workshop-item { padding-inline: 0; }
    .home-page .workshop-item + .workshop-item { border-left: 0; }
    .home-page .route-node { font-size: 0.5rem; padding-inline: 0.5rem; }
}
@media (prefers-reduced-motion: reduce) {
    .home-page .hero-lens, .home-page .spotlight-cover { transform: none; transition: none; }
    .home-page .workshop-item-media img { transition: none; }
    .home-page .scroll-companion, .home-page .route-traveler { display: none; }
}