/* ABSQURA Showroom. Loaded only on the Showroom page. Every selector is namespaced .abqs / .abqs-*. DESIGN.md tokens only.
   Depth = CSS 3D transforms on the real product photographs (transform + opacity only). Without JS the rail is a plain swipeable row. */
.abqs-page .hero-section, .abqs-page .entry-header, .abqs-page .page-title { display: none !important; }
.abqs-page .entry-content { padding-left: 0 !important; padding-right: 0 !important; max-width: none !important; }
.abqs-page .ct-container-full, .abqs-page [data-prefix="single_page"] .entry-content { max-width: none !important; }

.abqs { --abqs-ease: cubic-bezier(.22, .61, .36, 1); --abqs-gut: 20px; color: var(--abq-text, #333); font-family: 'DM Sans', sans-serif; overflow-x: clip; }
.abqs *, .abqs *::before, .abqs *::after { box-sizing: border-box; }
.abqs ul { list-style: none; margin: 0; padding: 0; }
.abqs a { text-decoration: none; color: inherit; }
.abqs img { display: block; max-width: 100%; height: auto; }
.abqs em { font-style: italic; }

.abqs-eyebrow { margin: 0 0 var(--abq-space-3, 12px); font-family: 'DM Mono', monospace; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--abq-muted, #6b6b6b); }
.abqs-title, .abqs-h2 { margin: 0; font-family: Georgia, serif; font-weight: 400; color: var(--abq-ink, #0e0e0e); line-height: 1.08; letter-spacing: -.01em; }
.abqs-title { font-size: clamp(40px, 11vw, 88px); }
.abqs-h2 { font-size: clamp(28px, 7vw, 44px); }
.abqs-lede { margin: var(--abq-space-4, 16px) 0 0; max-width: 38ch; font-size: 16px; line-height: 1.55; color: var(--abq-muted, #6b6b6b); }

.abqs-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--abq-space-6, 24px); font-family: 'DM Sans', sans-serif; font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; border: 1px solid var(--abq-ink, #0e0e0e); border-radius: 0; cursor: pointer; transition: background .2s var(--abqs-ease), color .2s var(--abqs-ease); }
.abqs-btn--solid { background: var(--abq-ink, #0e0e0e); color: #fff !important; }
.abqs-btn--solid:hover { background: #fff; color: var(--abq-ink, #0e0e0e) !important; }
.abqs-btn--ghost { background: transparent; color: var(--abq-ink, #0e0e0e) !important; }
.abqs-btn--ghost:hover { background: var(--abq-ink, #0e0e0e); color: #fff !important; }
.abqs a:focus-visible, .abqs button:focus-visible, .abqs-viewport:focus-visible { outline: 2px solid var(--abq-ink, #0e0e0e); outline-offset: 3px; }

/* hero */
.abqs-hero { padding: var(--abq-space-8, 64px) var(--abqs-gut) var(--abq-space-6, 24px); max-width: 1200px; margin: 0 auto; }
.abqs-cta { display: flex; flex-wrap: wrap; gap: var(--abq-space-3, 12px); margin-top: var(--abq-space-6, 24px); }

/* stage: the rail */
.abqs-stage { position: relative; background: var(--abq-stone, #f0ede6); padding: 0 0 var(--abq-space-6, 24px); }
.abqs-stage::before { content: ''; position: absolute; left: 0; right: 0; top: 28px; height: 2px; background: var(--abq-ink, #0e0e0e); z-index: 1; }       /* the rail */
.abqs-stage::after { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 28px; background: linear-gradient(to bottom, rgba(0,0,0,.05), transparent); pointer-events: none; }
.abqs-viewport { position: relative; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; overscroll-behavior-x: contain; padding: 30px 0 var(--abq-space-6, 24px); cursor: grab; touch-action: pan-x pan-y; }
.abqs-viewport::-webkit-scrollbar { display: none; }
.abqs-viewport.is-drag { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; }
.abqs-rail { display: flex; width: max-content; padding: 0 calc(50vw - var(--abqs-w) / 2); gap: var(--abq-space-3, 12px); --abqs-w: min(62vw, 300px); }
.abqs-item { position: relative; flex: 0 0 var(--abqs-w); width: var(--abqs-w); scroll-snap-align: center; padding-top: 40px; }
.abqs-item::before { content: ''; position: absolute; top: 0; left: 50%; width: 1px; height: 40px; background: var(--abq-ink, #0e0e0e); }                  /* hanger */
.abqs-item::after { content: ''; position: absolute; top: -3px; left: calc(50% - 3px); width: 7px; height: 7px; border-radius: 50%; background: var(--abq-ink, #0e0e0e); }
.abqs-card { display: block; transform: perspective(1100px) translateZ(var(--abqs-tz, 0)) rotateY(var(--abqs-ry, 0deg)) scale(var(--abqs-s, 1)); opacity: var(--abqs-o, 1); transition: transform .25s var(--abqs-ease), opacity .25s var(--abqs-ease); transform-origin: 50% 0; will-change: transform; }
.abqs-frame { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: #fff; box-shadow: 0 18px 28px -14px rgba(0,0,0,.28); }
.abqs-frame img { width: 100%; height: 100%; object-fit: cover; }
.abqs-cap { display: block; margin-top: var(--abq-space-3, 12px); font-size: 13px; line-height: 1.4; color: var(--abq-text, #333); }
.abqs-cap__name { display: block; }
.abqs-cap__price { font-family: 'DM Mono', monospace; font-size: 13px; color: var(--abq-ink, #0e0e0e); }
.abqs-cap__price del { color: var(--abq-muted, #6b6b6b); }
.abqs-cap__price ins { text-decoration: none; }

/* selected product panel */
.abqs-panel { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: var(--abq-space-3, 12px) var(--abq-space-4, 16px); max-width: 760px; margin: 0 auto; padding: var(--abq-space-4, 16px) var(--abqs-gut) 0; }
.abqs-count { grid-column: 1 / -1; margin: 0; font-family: 'DM Mono', monospace; font-size: 12px; letter-spacing: .12em; color: var(--abq-muted, #6b6b6b); }
.abqs-name { margin: 0; font-family: Georgia, serif; font-style: italic; font-weight: 400; font-size: 20px; line-height: 1.25; color: var(--abq-ink, #0e0e0e); }
.abqs-price { margin: var(--abq-space-1, 4px) 0 0; font-family: 'DM Mono', monospace; font-size: 15px; color: var(--abq-ink, #0e0e0e); }
.abqs-price del { color: var(--abq-muted, #6b6b6b); }
.abqs-price ins { text-decoration: none; }
.abqs-panel .abqs-btn { grid-column: 1; justify-self: start; }
.abqs-nav { display: flex; gap: var(--abq-space-2, 8px); grid-column: 2; grid-row: 2 / span 2; align-self: end; }
.abqs-arrow { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--abq-ink, #0e0e0e); color: var(--abq-ink, #0e0e0e); border-radius: 0; font-size: 18px; cursor: pointer; padding: 0; }
.abqs-arrow:hover { background: var(--abq-ink, #0e0e0e); color: #fff; }
.abqs-arrow[disabled] { opacity: .35; cursor: default; background: transparent; color: var(--abq-ink, #0e0e0e); }

/* sections */
.abqs-collections, .abqs-grid-sec, .abqs-story, .abqs-final { max-width: 1200px; margin: 0 auto; padding: var(--abq-space-8, 64px) var(--abqs-gut) 0; }
.abqs-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--abq-space-3, 12px); margin-top: var(--abq-space-6, 24px); }
.abqs-tile a { display: block; }
.abqs-tile__img { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--abq-stone, #f0ede6); }
.abqs-tile__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--abqs-ease); }
.abqs-tile a:hover img { transform: scale(1.03); }
.abqs-tile__name { display: block; margin-top: var(--abq-space-2, 8px); font-family: Georgia, serif; font-style: italic; font-size: 18px; color: var(--abq-ink, #0e0e0e); }
.abqs-tile__count { display: block; font-family: 'DM Mono', monospace; font-size: 12px; color: var(--abq-muted, #6b6b6b); }
.abqs-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--abq-space-4, 16px) var(--abq-space-3, 12px); margin-top: var(--abq-space-6, 24px); }
.abqs-gcard a { display: block; }
.abqs-gcard__img { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--abq-stone, #f0ede6); }
.abqs-gcard__img img { width: 100%; height: 100%; object-fit: cover; }
.abqs-gcard__name { display: block; margin-top: var(--abq-space-2, 8px); font-size: 14px; line-height: 1.35; color: var(--abq-text, #333); }
.abqs-gcard__price { display: block; margin-top: 2px; font-family: 'DM Mono', monospace; font-size: 13px; color: var(--abq-ink, #0e0e0e); }
.abqs-gcard__price del { color: var(--abq-muted, #6b6b6b); }
.abqs-gcard__price ins { text-decoration: none; }
.abqs-more { margin: var(--abq-space-6, 24px) 0 0; }
.abqs-story { display: grid; gap: var(--abq-space-6, 24px); align-items: center; }
.abqs-story__text p:not(.abqs-eyebrow) { margin: var(--abq-space-4, 16px) 0 0; max-width: 42ch; font-size: 16px; line-height: 1.6; color: var(--abq-muted, #6b6b6b); }
.abqs-story__img { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--abq-stone, #f0ede6); }
.abqs-story__img img { width: 100%; height: 100%; object-fit: cover; }
.abqs-final { text-align: center; padding-bottom: var(--abq-space-8, 64px); }
.abqs-final p { margin: var(--abq-space-6, 24px) 0 0; }

/* reveal (only when JS has marked the page; content is visible without it) */
.abqs.is-js .abqs-rv { opacity: 0; transform: translateY(12px); transition: opacity .6s var(--abqs-ease), transform .6s var(--abqs-ease); }
.abqs.is-js .abqs-rv.is-in { opacity: 1; transform: none; }

@media (min-width: 782px) {
	.abqs { --abqs-gut: 40px; }
	.abqs-rail { --abqs-w: 300px; gap: var(--abq-space-6, 24px); }
	.abqs-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.abqs-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--abq-space-6, 24px) var(--abq-space-4, 16px); }
	.abqs-story { grid-template-columns: 1fr 1fr; gap: var(--abq-space-8, 64px); }
	.abqs-panel { grid-template-columns: 1fr auto auto; }
	.abqs-name { font-size: 24px; }
	.abqs-count { grid-column: 1 / -1; }
	.abqs-nav { grid-column: 3; grid-row: 2; align-self: center; }
}
@media (prefers-reduced-motion: reduce) {
	.abqs-card, .abqs-tile__img img, .abqs.is-js .abqs-rv { transition: none !important; }
	.abqs-card { transform: none !important; opacity: 1 !important; }
	.abqs.is-js .abqs-rv { opacity: 1; transform: none; }
	.abqs-viewport { scroll-behavior: auto; }
}

.abqs a, .abqs a * { text-decoration: none !important; box-shadow: none; }
.abqs-frame { box-shadow: 0 18px 28px -14px rgba(0, 0, 0, .28) !important; }

/* beat the theme's content-link underline and the 20px page gutter rule (the showroom is full-bleed and sets its own gutters) */
html body .abqs a:not(#abq-x), html body .abqs a:not(#abq-x) * { text-decoration: none !important; }
html body.abqs-page .entry-content:not(#abq-x) { padding-left: 0 !important; padding-right: 0 !important; }
html body.abqs-page.page .entry-content.entry-content:not(#abq-x) { padding-left: 0 !important; padding-right: 0 !important; max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }
html body.abqs-page .entry-content > .abqs:not(#abq-x) { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; }

/* 3D layer: shown only once a model has loaded (is-gl); the CSS rail below stays as the fallback and as the crawlable, keyboard-reachable list */
.abqs-gl { display: none; position: relative; height: clamp(440px, 118vw, 470px); margin-top: 0; }
.abqs-gl canvas { display: block; width: 100%; height: 100%; touch-action: pan-y; cursor: grab; }
.abqs-gl__note { position: absolute; left: var(--abqs-gut, 20px); bottom: 4px; margin: 0; font-family: 'DM Mono', monospace; font-size: 11px; letter-spacing: .04em; color: var(--abq-muted, #6b6b6b); }
.abqs.is-gl .abqs-gl { display: block; }
.abqs.is-gl .abqs-viewport { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.abqs.is-gl .abqs-stage::before, .abqs.is-gl .abqs-stage::after { display: none; }
@media (min-width: 782px) { .abqs-gl { height: clamp(420px, 33vw, 500px); } }

/* less copy: heading only in the hero, panel is name + price + one button */
.abqs-hero { padding-bottom: var(--abq-space-4, 16px); }
.abqs-count { display: none !important; }
.abqs-final { padding-top: var(--abq-space-6, 24px); }
.abqs-collections { padding-top: var(--abq-space-6, 24px); }
.abqs-grid-sec { padding-top: var(--abq-space-6, 24px); }
.abqs .screen-reader-text { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.abqs-zoom { display: none; font-size: 22px; line-height: 1; }
.abqs.is-gl .abqs-zoom { display: inline-flex; }

.abqs-hero { display: none !important; }
.abqs-stage { padding-top: 0; }

/* phones: the arrows sit under the button (left), clear of the chat bubble at the bottom right */
@media (max-width: 781px) { .abqs-nav { grid-column: 1; grid-row: auto; justify-self: start; align-self: start; } }

/* Women / Men switch above the rail */
.abqs-gender { position: absolute; top: 12px; left: 50%; transform: translateX(-50%); z-index: 3; display: flex; gap: 0; border: 1px solid var(--abq-ink, #0e0e0e); background: var(--abq-paper, #fff); }
.abqs .abqs-gender a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 88px; padding: 0 16px; font-family: 'DM Sans', sans-serif; font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--abq-ink, #0e0e0e); }
.abqs .abqs-gender a[aria-current="page"] { background: var(--abq-ink, #0e0e0e); color: #fff; }