/* Tilted frames and offset shadows bleed past the viewport edge; clip instead of scrolling. */
body { overflow-x: clip; }

/* Andonasty Ink — effects theme.json cannot express. Loaded on the front end and in the editor. */

:root {
  --ink-gutter: var(--wp--custom--gutter--mobile, 20px);
}
/* The page gutter. theme.json uses it as the root padding, so alignfull blocks escape exactly this much and go edge to edge. */
@media (min-width: 782px) {
  :root { --ink-gutter: var(--wp--custom--gutter--desktop, 56px); }
}

/* Riso offset shadow on display headings: add class "riso" (crimson) or "riso-acid" / "riso-ink". */
.riso            { text-shadow: 0.03em 0.03em 0 var(--wp--preset--color--crimson); }
.riso-acid       { text-shadow: 0.03em 0.03em 0 var(--wp--preset--color--acid); }
.riso-ink        { text-shadow: 0.03em 0.03em 0 var(--wp--preset--color--ink); }

/* Marker underline on one word: <span class="marker">make</span> */
.marker { position: relative; display: inline-block; z-index: 0; }
.marker::after {
  content: ''; position: absolute; left: -2%; right: -2%; bottom: 0.05em; height: 0.28em;
  background: var(--wp--preset--color--acid); z-index: -1; transform: rotate(-1.2deg);
}

/* Sticker: a tilted mono label. Combine with color classes from the palette. */
.sticker {
  display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px;
  background: var(--wp--preset--color--acid); color: var(--wp--preset--color--ink);
  font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta);
  font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase;
  transform: rotate(var(--wp--custom--tilt--sticker, -2.5deg));
  box-shadow: var(--wp--preset--shadow--sticker);
}
.sticker.is-paper   { background: var(--wp--preset--color--paper); }
.sticker.is-magenta { background: var(--wp--preset--color--magenta); }
.sticker.is-crimson { background: var(--wp--preset--color--crimson); color: var(--wp--preset--color--paper); }
.sticker.is-ink     { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--acid); box-shadow: 3px 3px 0 var(--wp--preset--color--acid); }

/* Square tag. */
.tag {
  display: inline-block; padding: 6px 12px; border: 2px solid currentColor;
  font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); letter-spacing: 0.06em; text-transform: uppercase;
}

/* Numbered section label: <p class="eyebrow">01 — Work</p> */
.eyebrow {
  font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta);
  letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--acid); margin: 0;
}
.has-paper-background-color .eyebrow { color: var(--wp--preset--color--crimson); }

/* Buttons: press into the shadow on hover; outline and ink variants as block styles. */
.wp-block-button__link { transition: transform 120ms ease, box-shadow 120ms ease; }
.wp-block-button__link:hover { transform: translate(2px, 2px); box-shadow: 3px 3px 0 var(--wp--preset--color--crimson); }
.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-outline-paper .wp-block-button__link {
  background: transparent; color: var(--wp--preset--color--paper); border-color: var(--wp--preset--color--paper); box-shadow: none;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); transform: none; }
.wp-block-button.is-style-ink .wp-block-button__link {
  background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); border-color: var(--wp--preset--color--ink);
}
.wp-block-button.is-style-ink .wp-block-button__link:hover { color: var(--wp--preset--color--acid); }
.wp-block-button.is-style-small .wp-block-button__link { padding: 11px 18px; font-size: 13px; }

/* Tilted, framed image with a colored block behind it (hero, featured project). */
.riso-frame { position: relative; display: inline-block; max-width: 100%; }
.riso-frame::before {
  content: ''; position: absolute; inset: 24px -24px -24px 24px;
  background: var(--wp--preset--color--crimson); transform: rotate(4deg); z-index: 0;
}
.riso-frame.is-ink::before { background: var(--wp--preset--color--ink); transform: rotate(-3deg); }
.riso-frame img { position: relative; z-index: 1; max-width: 100%; height: auto; transform: rotate(var(--wp--custom--tilt--image, -2deg)); display: block; }

/* Category / artwork card: framed image + label bar. Used inside Query Loop and the work grid pattern. */
.ink-card { display: flex; flex-direction: column; border: 3px solid var(--wp--preset--color--paper); background: var(--wp--preset--color--ink-2); text-decoration: none; }
.ink-card img { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; border: 0; }
.ink-card__bar { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; border-top: 3px solid var(--wp--preset--color--paper); font-weight: 700; }
.ink-card__bar .index { font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--acid); }

/* Exhibition rows from the Query Loop. */
.exhibition-row { display: grid; grid-template-columns: 220px minmax(0, 1fr) 200px; gap: 24px; align-items: baseline; padding: 24px 0; border-top: 2px solid var(--wp--preset--color--ink-40); }
.exhibition-row .date { font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--ui); color: var(--wp--preset--color--paper-40); margin: 0; }
.exhibition-row .title { font-family: var(--wp--preset--font-family--display-cond); font-weight: 700; font-size: var(--wp--preset--font-size--display-m); text-transform: uppercase; line-height: 1; margin: 0; }
.exhibition-row .meta { color: var(--wp--preset--color--paper-40); font-size: 15px; margin: 4px 0 0; }
.exhibition-row .city { text-align: right; color: var(--wp--preset--color--paper-60); font-size: 15px; margin: 0; }
.exhibition-row.is-current { border-top-color: var(--wp--preset--color--paper); }
.exhibition-row.is-current .date { color: var(--wp--preset--color--acid); }
@media (max-width: 781px) {
  .exhibition-row { grid-template-columns: 1fr; gap: 6px; padding: 18px 0; }
  .exhibition-row .city { text-align: left; }
}

/* Marquee band. Pauses for people who asked for less motion. */
.band { border-top: 3px solid var(--wp--preset--color--ink); border-bottom: 3px solid var(--wp--preset--color--ink); }
.band__clip { overflow: hidden; }
.hero { position: relative; overflow: hidden; }
.hero > .scan { z-index: 0; }
/* Size the unbroken kinetic words against their column, not the viewport.
   Overrides the font size saved in existing Home blocks without rewriting their content. */
.hero .wp-block-column { min-width: 0; container-type: inline-size; }
.hero h1.kin { font-size: clamp(24px, 10.5cqi, 112px) !important; max-width: 100%; }
.band__track {
  display: flex; gap: 40px; white-space: nowrap; padding: 18px var(--ink-gutter);
  font-family: var(--wp--preset--font-family--display); font-weight: 700; font-size: clamp(26px, 2.8vw, 40px); text-transform: uppercase;
  animation: band-scroll 28s linear infinite;
}
.band__track .dot { color: var(--wp--preset--color--crimson); }
@keyframes band-scroll { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .band__track { animation: none; } }

/* Contact form. Field spec from the design system card components/form-contact.html:
   mono uppercase label, 3px paper frame on an ink-2 well, acid border and crimson offset on focus. */
.contact-form { display: flex; flex-direction: column; gap: var(--wp--preset--spacing--40); }
.form { display: flex; flex-direction: column; gap: 16px; }
.field { display: flex; flex-direction: column; gap: 8px; }
.field label { font-family: var(--wp--preset--font-family--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--wp--preset--color--paper-60); }
.field label i { font-style: normal; opacity: 0.6; }
.field input, .field textarea {
  box-sizing: border-box; width: 100%; min-height: 52px; padding: 14px 16px;
  background: var(--wp--preset--color--ink-2); border: 3px solid var(--wp--preset--color--paper); border-radius: 0;
  color: var(--wp--preset--color--paper); font-family: inherit; font-size: 16px; outline: none;
  transition: border-color 140ms ease, box-shadow 140ms ease;
}
.field textarea { min-height: 128px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: var(--wp--preset--color--paper-40); }
.field input:focus, .field textarea:focus { border-color: var(--wp--preset--color--acid); box-shadow: 4px 4px 0 var(--wp--preset--color--crimson); }
.field.is-bad input, .field.is-bad textarea { border-color: var(--wp--preset--color--crimson); }
.field__err { color: var(--wp--preset--color--crimson); font-size: var(--wp--preset--font-size--meta); }
.form-send { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-top: 4px; }
.form-send .mono { font-size: 12px; color: var(--wp--preset--color--paper-40); }
.form-note { margin: 0; padding: 16px 18px; border: 3px solid var(--wp--preset--color--paper); font-size: 15px; }
.form-note.is-ok { border-color: var(--wp--preset--color--acid); box-shadow: 4px 4px 0 var(--wp--preset--color--crimson); }
.form-note.is-bad { border-color: var(--wp--preset--color--crimson); }
/* The honeypot: off-screen rather than display:none, which some bots check for. */
.form-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* A paper section flips the well and the frame. */
.has-paper-background-color .field input, .has-paper-background-color .field textarea { background: var(--wp--preset--color--paper); border-color: var(--wp--preset--color--ink); color: var(--wp--preset--color--ink); }
.has-paper-background-color .field label { color: var(--wp--preset--color--ink); }

/* Contact block: stacked rows in one frame. */
.contact-block { border: 3px solid var(--wp--preset--color--paper); }
.contact-block > * { display: flex; justify-content: space-between; align-items: center; padding: 22px 24px; margin: 0; border-bottom: 3px solid var(--wp--preset--color--paper); font-size: 20px; font-weight: 600; }
.contact-block > *:last-child { border-bottom: 0; font-size: 16px; font-weight: 400; color: var(--wp--preset--color--paper-60); }

/* Grain on dark surfaces. */
body::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9999; opacity: 0.07; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.9 0'/></filter><rect width='240' height='240' filter='url(%23n)'/></svg>");
}

/* Paper sections flip the ink. */
.has-paper-background-color { color: var(--wp--preset--color--ink); }
.has-paper-background-color a { color: var(--wp--preset--color--ink); }
.has-paper-background-color a:hover { color: var(--wp--preset--color--crimson); }
.has-paper-background-color .ink-card { border-color: var(--wp--preset--color--ink); background: var(--wp--preset--color--paper); }
.has-paper-background-color .ink-card__bar { border-top-color: var(--wp--preset--color--ink); }
.has-paper-background-color .wp-block-image img { border-color: var(--wp--preset--color--ink); }

/* Language switch (Polylang / WPML menu item, or a plain two-link group). */
.lang-switch { display: inline-flex; border: 1px solid var(--wp--preset--color--ink-40); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); }
.lang-switch a { padding: 6px 10px; color: var(--wp--preset--color--paper-40); }
.lang-switch a.is-active, .lang-switch .current-lang a { background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); }

/* Header: logo left, menu, socials + language + call to action right. Active and hover are acid, no underline (DS Navigation). */
.site-header { min-height: 88px; gap: var(--wp--preset--spacing--40); padding-left: var(--ink-gutter); padding-right: var(--ink-gutter); }
footer.wp-block-group.alignfull { padding-left: var(--ink-gutter); padding-right: var(--ink-gutter); }
.site-logo { display: block; height: 40px; line-height: 0; flex: none; }
.site-logo svg { height: 40px; width: auto; display: block; transition: transform 180ms cubic-bezier(.16, 1, .3, 1); }
.site-logo:hover svg { transform: rotate(-6deg) scale(1.06); }
.site-header .wp-block-navigation a { text-decoration: none; }
.site-header .wp-block-navigation .wp-block-navigation__container { gap: var(--wp--preset--spacing--40); flex-wrap: nowrap; }
.site-header .wp-block-navigation-item__content { white-space: nowrap; letter-spacing: 0.04em; }
.site-header .wp-block-social-links { flex-wrap: nowrap; }
.site-tools { flex: none; }
/* Seven items need room: the call to action only appears on wide screens; the burger takes over under 960px (core switches at 600px). */
@media (max-width: 1199px) { .site-header .site-cta { display: none; } }
@media (max-width: 960px) {
  .site-header .wp-block-navigation__responsive-container:not(.is-menu-open) { display: none; }
  .site-header .wp-block-navigation__responsive-container-open:not(.always-shown) { display: flex; }
}
.site-header .wp-block-navigation a:hover, .site-header .wp-block-navigation .current-menu-item > a, .site-header .wp-block-navigation .current-menu-ancestor > a { color: var(--wp--preset--color--acid); }
.site-header .wp-block-social-links .wp-social-link svg { width: 20px; height: 20px; }
.site-header .wp-block-social-links .wp-social-link:hover { transform: translateY(-2px); color: var(--wp--preset--color--acid) !important; }
.site-header .wp-block-navigation__responsive-container-open { width: 44px; height: 44px; padding: 0; background: var(--wp--preset--color--acid); color: var(--wp--preset--color--ink); justify-content: center; }
.site-header .wp-block-navigation__responsive-container-open svg { width: 24px; height: 24px; }
.wp-block-navigation__responsive-container.is-menu-open { padding: var(--wp--preset--spacing--60) var(--wp--preset--spacing--40); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: var(--wp--preset--spacing--40); }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { font-family: var(--wp--preset--font-family--display-cond); font-size: var(--wp--preset--font-size--display-m); font-weight: 900; text-transform: uppercase; letter-spacing: 0; }
.wp-block-navigation__responsive-container-close { color: var(--wp--preset--color--acid); }
@media (max-width: 960px) {
  .site-header { min-height: 64px; }
  .site-logo, .site-logo svg { height: 30px; }
  /* Phone (DS): logo left; language and the 44px acid menu block on the right. */
  .site-header .site-tools { margin-left: auto; }
  .site-header .wp-block-navigation { order: 3; }
}
@media (max-width: 600px) {
  .site-header .wp-block-social-links { display: none; }
}

/* Section head / foot rows (Artwear, archive) */
.section-head { align-items: flex-end; margin-bottom: var(--wp--preset--spacing--60); gap: var(--wp--preset--spacing--40); }
.section-head .lead { max-width: 620px; }
.section-foot { margin-top: var(--wp--preset--spacing--50); padding-top: var(--wp--preset--spacing--40); border-top: 1px solid var(--wp--preset--color--ink-20); }
.text-link { border-bottom: 2px solid var(--wp--preset--color--crimson); padding-bottom: 4px; text-decoration: none; letter-spacing: 0.06em; }
.price-block { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.price { font-family: var(--wp--preset--font-family--display); font-weight: 900; font-size: clamp(40px, 5vw, 64px); line-height: 1; }
.mono { font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); color: var(--wp--preset--color--paper-40); }
.mono.is-acid { color: var(--wp--preset--color--acid); }

/* Artwear: drop cards */
.drop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px; }
.drop-card { position: relative; display: flex; flex-direction: column; border: 3px solid var(--wp--preset--color--paper); background: var(--wp--preset--color--ink-2); color: inherit; text-decoration: none; }
.drop-card > .gimg { display: block; }
.drop-card__tag { position: absolute; right: -6px; top: -12px; z-index: 2; }
.drop-card__bar { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-top: 3px solid var(--wp--preset--color--paper); background: var(--wp--preset--color--ink-2); }
.drop-card__row { display: flex; align-items: center; justify-content: space-between; font-size: 17px; }
.drop-card.is-next { background: var(--wp--preset--color--crimson); }
.drop-card__next { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; width: 100%; aspect-ratio: 1; color: var(--wp--preset--color--ink); }
.drop-card__next .num { font-family: var(--wp--preset--font-family--display); font-weight: 900; font-size: clamp(120px, 12vw, 180px); line-height: 0.9; text-shadow: 6px 6px 0 var(--wp--preset--color--acid); }
.drop-card__next .lbl { color: var(--wp--preset--color--paper); }
.channels { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: var(--wp--preset--spacing--50); }
.channels .lbl { margin-right: 6px; }
.tags { display: flex; flex-wrap: wrap; gap: 10px; }
.has-paper-background-color .tag { border-color: var(--wp--preset--color--ink); }

/* Merch Studio: the four steps on paper */
.step-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.step { display: flex; flex-direction: column; gap: 14px; padding: 28px; border: 3px solid var(--wp--preset--color--ink); background: var(--wp--preset--color--paper); box-shadow: 8px 8px 0 var(--wp--preset--color--crimson); }
.step__num { font-family: var(--wp--preset--font-family--display); font-weight: 900; font-size: 72px; line-height: 0.9; color: var(--wp--preset--color--crimson); }
.step__title { font-family: var(--wp--preset--font-family--display-cond); font-weight: 700; font-size: 32px; line-height: 1; text-transform: uppercase; }
.step__text { font-size: 15px; line-height: 1.5; color: var(--wp--preset--color--ink-40); }
@media (max-width: 600px) { .step-grid { grid-template-columns: 1fr; } .step { box-shadow: 5px 5px 0 var(--wp--preset--color--crimson); } }

/* Header dropdown (Merch Studio → projects) */
.site-header .wp-block-navigation .wp-block-navigation__submenu-container { background: var(--wp--preset--color--ink-2); border: 3px solid var(--wp--preset--color--paper); box-shadow: 5px 5px 0 var(--wp--preset--color--crimson); padding: 8px 0; min-width: 240px; }
.site-header .wp-block-navigation .wp-block-navigation__submenu-container a { padding: 10px 18px; }

/* Full-width rows inside a constrained section: span the viewport, keep the page gutter. */
.is-layout-constrained > .bleed-full.alignfull { padding-left: var(--ink-gutter); padding-right: var(--ink-gutter); }

/* Gallery: filters as stickers, tags and riso swatches; cards hide instantly. */
.gallery-count { margin: 0; font-size: var(--wp--preset--font-size--ui); color: var(--wp--preset--color--paper-40); }
.gallery-count__n { color: var(--wp--preset--color--acid); }
.gallery-filters { display: flex; flex-direction: column; gap: 14px; margin: var(--wp--preset--spacing--50) 0 var(--wp--preset--spacing--60); padding-top: var(--wp--preset--spacing--40); border-top: 3px solid var(--wp--preset--color--paper); }
.gallery-facet { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.gallery-facet .lbl { min-width: 96px; }
.gallery-facet .chip { font: inherit; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; line-height: 1.2; background: var(--wp--preset--color--ink-2); color: var(--wp--preset--color--paper); border: 2px solid var(--wp--preset--color--ink-40); font-family: var(--wp--preset--font-family--mono); font-size: 12px; font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; cursor: pointer; transform: rotate(0); transition: transform 160ms ease, background 160ms ease, color 160ms ease; }
.gallery-facet .chip i { font-style: normal; color: var(--wp--preset--color--paper-40); }
.gallery-facet .chip:hover { transform: rotate(-2deg); border-color: var(--wp--preset--color--paper); }
.gallery-facet .chip.is-active { background: var(--wp--preset--color--acid); color: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--acid); box-shadow: 3px 3px 0 var(--wp--preset--color--crimson); transform: rotate(-2deg); }
.gallery-facet .chip.is-active i { color: var(--wp--preset--color--ink-40); }
.gallery-facet .tag { font: inherit; font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); letter-spacing: 0.06em; text-transform: uppercase; background: transparent; color: var(--wp--preset--color--paper-60); cursor: pointer; }
.gallery-facet .tag:hover { color: var(--wp--preset--color--paper); }
.gallery-facet .tag.is-active { color: var(--wp--preset--color--ink); background: var(--wp--preset--color--paper); border-color: var(--wp--preset--color--paper); }
.gallery-facet .swatch { width: 28px; height: 28px; padding: 0; border: 3px solid var(--wp--preset--color--paper-40); background: var(--sw, transparent); cursor: pointer; transition: transform 160ms ease, box-shadow 160ms ease; }
.gallery-facet .swatch.is-all { background: conic-gradient(var(--wp--preset--color--crimson) 0 33%, var(--wp--preset--color--acid) 0 66%, var(--wp--preset--color--teal) 0); }
.gallery-facet .swatch:hover { transform: rotate(-6deg) scale(1.1); border-color: var(--wp--preset--color--paper); }
.gallery-facet .swatch.is-active { border-color: var(--wp--preset--color--paper); box-shadow: 3px 3px 0 var(--wp--preset--color--crimson); transform: rotate(-6deg); }
.gallery-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px; }
.gallery-item.is-hidden { display: none; }
.gallery-item .gimg { display: block; }
.gallery-item__blank { display: flex; align-items: center; justify-content: center; aspect-ratio: 1; background: var(--wp--preset--color--crimson); color: var(--wp--preset--color--ink); font-family: var(--wp--preset--font-family--display); font-weight: 900; font-size: 120px; }
.gallery-empty { margin: var(--wp--preset--spacing--50) 0 0; color: var(--wp--preset--color--paper-60); }
.gallery-empty .text-link { font: inherit; background: none; border: 0; color: var(--wp--preset--color--paper); cursor: pointer; }
@media (max-width: 600px) { .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } .gallery-facet .lbl { min-width: 100%; } }
.gallery-facet__rail { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
/* On a phone four wrapping facets stack into a screen and a half of chips before the first artwork.
   Each facet becomes a rail instead: label on its own line, choices scrolling sideways under it.
   The padding keeps the tilted active chip and its offset shadow clear of the scroll edges. */
@media (max-width: 1023px) {
	.gallery-filters { min-width: 0; }
	.gallery-facet { flex-direction: column; align-items: stretch; gap: 8px; min-width: 0; }
	.gallery-facet .lbl { min-width: 0; }
	/* min-width:0 and max-width are what keep the rail inside the screen: without them the row of chips
	   sizes its parents to its own content width and the whole page scrolls sideways. */
	.gallery-facet__rail { min-width: 0; max-width: 100%; flex-wrap: nowrap; overflow-x: auto; overscroll-behavior-x: contain; padding: 4px 2px 8px; scrollbar-width: none; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
	.gallery-facet__rail::-webkit-scrollbar { display: none; }
	.gallery-facet__rail > * { flex: 0 0 auto; scroll-snap-align: start; }
}

/* Home page blocks (core blocks carrying theme classes) */
.drop-card.wp-block-group { gap: 0; }
.drop-card .wp-block-image { margin: 0; }
.drop-card .wp-block-image img { width: 100%; }
.drop-card__bar.wp-block-group { margin-top: 0; }
.drop-card p, .step p, .price-block p, .contact-block p { margin: 0; }
.drop-card__row { display: flex; align-items: center; justify-content: space-between; }
.drop-card__tag.sticker { position: absolute; right: -6px; top: -12px; }
.step-grid.wp-block-group { display: grid; }
.riso-frame.wp-block-image { display: inline-block; margin: 0; }
.riso-frame.wp-block-image img { position: relative; z-index: 1; border: 3px solid var(--wp--preset--color--paper); }
.riso-frame.is-ink.wp-block-image img { border-color: var(--wp--preset--color--ink); transform: none; }
.timeline { display: flex; flex-wrap: wrap; gap: 12px 32px; margin: 0; font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); letter-spacing: 0.08em; text-transform: uppercase; color: var(--wp--preset--color--paper-40); }
.timeline b { font-weight: 500; color: var(--wp--preset--color--acid); margin-right: 6px; }
.timeline .is-now b { color: var(--wp--preset--color--crimson); }
p.channels, p.tags { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
p.sticker { display: inline-flex; }
.price-block.wp-block-group { align-items: flex-end; }
.contact-block.wp-block-group > p { display: flex; justify-content: space-between; align-items: center; padding: 22px 24px; border-bottom: 3px solid var(--wp--preset--color--paper); font-size: 20px; font-weight: 600; }
.contact-block.wp-block-group > p:last-child { border-bottom: 0; font-size: 16px; font-weight: 400; color: var(--wp--preset--color--paper-60); }
.contact-block a { text-decoration: none; }
.hero .wp-block-image.riso-frame img { transform: rotate(var(--wp--custom--tilt--image, -2deg)); }

/* Artworks by category (Query Loop pattern) */
.artworks-loop .wp-block-post-template.work-grid { gap: 24px; }
.artworks-loop .ink-card { gap: 0; }
.artworks-loop .wp-block-post-featured-image { margin: 0; }
.artworks-loop .wp-block-post-featured-image.gimg { aspect-ratio: 1; }
.artworks-loop .wp-block-post-featured-image a { display: block; }
.ink-card__bar h3 { font-family: var(--wp--preset--font-family--body); font-weight: 700; font-size: 17px; line-height: 1.3; letter-spacing: 0; text-transform: none; margin: 0; }
.ink-card__bar h3 a { text-decoration: none; }
.ink-card__bar .wp-block-post-terms a { text-decoration: none; color: inherit; }
.artworks-loop .wp-block-query-pagination { margin-top: var(--wp--preset--spacing--60); font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--ui); }
.artworks-loop .wp-block-query-pagination a, .artworks-loop .wp-block-query-pagination .page-numbers { text-decoration: none; padding: 8px 12px; }
.artworks-loop .wp-block-query-pagination .page-numbers.current { color: var(--wp--preset--color--acid); }

/* Gallery cards without titles (the large view carries the info) */
.gallery-item { cursor: zoom-in; }
.gallery-item .gimg { aspect-ratio: 1; }
.artworks-loop .ink-card .wp-block-post-featured-image { cursor: zoom-in; }

/* Large view */
.artbox { position: fixed; inset: 0; z-index: 900; display: none; grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); grid-template-rows: minmax(0, 1fr); align-items: stretch; }
.artbox.is-open { display: grid; }
html.has-artbox { overflow: hidden; }
.artbox__back { position: absolute; inset: 0; background: var(--wp--preset--color--ink); }
.artbox__figure { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; margin: 0; padding: clamp(24px, 5vw, 72px); min-width: 0; }
.artbox__figure img { max-width: 100%; max-height: calc(100vh - 2 * clamp(24px, 5vw, 72px)); width: auto; height: auto; object-fit: contain; border: 3px solid var(--wp--preset--color--paper); box-shadow: 12px 12px 0 var(--wp--preset--color--crimson); background: var(--wp--preset--color--ink-2); animation: artbox-in var(--wp--custom--motion--dur, 380ms) var(--wp--custom--motion--ease-snap, ease) both; }
@keyframes artbox-in { from { opacity: 0; transform: translateY(16px) rotate(-1deg); } to { opacity: 1; transform: none; } }
.artbox__count { position: absolute; left: clamp(24px, 5vw, 72px); bottom: 12px; color: var(--wp--preset--color--paper-40); }
.artbox__info { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 16px; padding: clamp(24px, 4vw, 48px) clamp(24px, 4vw, 48px) clamp(24px, 4vw, 48px) 0; overflow: auto; }
.artbox__info > p { margin: 0; }
.artbox__title { font-size: clamp(28px, 2.6vw, 40px); margin: 0; }
.artbox__meta { color: var(--wp--preset--color--acid); }
.artbox__text { color: var(--wp--preset--color--paper-60); font-size: 15px; line-height: 1.5; }
.artbox__tags { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; }
.artbox__tags .sticker, .artbox__tags .tag { text-decoration: none; color: inherit; }
.artbox__tags .sticker { color: var(--wp--preset--color--ink); }
.artbox__swatch { display: inline-flex; align-items: center; gap: 8px; font-family: var(--wp--preset--font-family--mono); font-size: var(--wp--preset--font-size--meta); letter-spacing: 0.06em; text-transform: uppercase; color: var(--wp--preset--color--paper-60); text-decoration: none; }
.artbox__swatch i { width: 18px; height: 18px; border: 2px solid var(--wp--preset--color--paper); }
.artbox__link { margin-top: auto !important; padding-top: 24px; }
.artbox__link a { color: var(--wp--preset--color--paper-40); text-decoration: none; border-bottom: 2px solid var(--wp--preset--color--crimson); }
.artbox__close, .artbox__nav { position: absolute; z-index: 2; width: 52px; height: 52px; border: 3px solid var(--wp--preset--color--paper); background: var(--wp--preset--color--ink); color: var(--wp--preset--color--paper); font-family: var(--wp--preset--font-family--mono); font-size: 20px; cursor: pointer; transition: transform 160ms ease, background 160ms ease, color 160ms ease; }
.artbox__close:hover, .artbox__nav:hover { background: var(--wp--preset--color--acid); color: var(--wp--preset--color--ink); border-color: var(--wp--preset--color--acid); transform: rotate(-4deg); }
.artbox__close { top: 16px; right: 16px; }
.artbox__nav { top: 50%; transform: translateY(-50%); }
.artbox__nav:hover { transform: translateY(-50%) rotate(-4deg); }
.artbox__nav.is-prev { left: 16px; }
.artbox__nav.is-next { right: 416px; }
.artbox__nav:disabled { display: none; }
@media (max-width: 900px) {
  .artbox { grid-template-columns: 1fr; grid-template-rows: minmax(0, 1fr) auto; }
  .artbox__figure { padding: 64px 16px 16px; }
  .artbox__figure img { max-height: 58vh; box-shadow: 6px 6px 0 var(--wp--preset--color--crimson); }
  .artbox__info { padding: 0 16px 24px; max-height: 40vh; }
  .artbox__nav.is-next { right: 16px; }
  .artbox__nav { top: 34%; }
  .artbox__count { left: 16px; bottom: auto; top: 24px; }
}

/* Dynamic gallery: load-more row, refreshing state */
.gallery-more { display: flex; align-items: center; justify-content: center; gap: 16px; margin-top: var(--wp--preset--spacing--60); }
.gallery-more__spinner { color: var(--wp--preset--color--paper-40); }
.gallery-grid.is-refreshing { opacity: 0.4; transition: opacity 160ms ease; }
.gallery.is-loading .gallery-more [data-more] { opacity: 0.5; pointer-events: none; }

/* Artworks with several photos: badge on the card, thumbnails in the large view */
.ink-card { position: relative; }
.ink-card__n { position: absolute; right: 10px; top: 10px; z-index: 3; min-width: 28px; height: 28px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; background: var(--wp--preset--color--acid); color: var(--wp--preset--color--ink); font-size: 12px; font-weight: 500; letter-spacing: 0.06em; box-shadow: 3px 3px 0 var(--wp--preset--color--ink); transform: rotate(4deg); pointer-events: none; }
.ink-card__n::before { content: '⧉ '; }
.artworks-loop .ink-card { overflow: visible; }
.artbox__figure { flex-direction: column; gap: 14px; }
.artbox__thumbs { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; max-width: 100%; }
.artbox__thumbs:empty { display: none; }
.artbox__thumbs button { width: 56px; height: 56px; padding: 0; border: 3px solid var(--wp--preset--color--ink-40); background: var(--wp--preset--color--ink-2); cursor: pointer; overflow: hidden; transition: transform 160ms ease, border-color 160ms ease; }
.artbox__thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.artbox__thumbs button:hover { border-color: var(--wp--preset--color--paper); transform: rotate(-4deg); }
.artbox__thumbs button.is-active { border-color: var(--wp--preset--color--acid); box-shadow: 3px 3px 0 var(--wp--preset--color--crimson); }
.artbox__figure img.artbox__main { max-height: calc(100vh - 2 * clamp(24px, 5vw, 72px) - 84px); }
@media (max-width: 900px) { .artbox__figure img.artbox__main { max-height: 48vh; } .artbox__thumbs button { width: 44px; height: 44px; } }

/* Large view, Ink & Riso dressing */
.artbox__stage.gimg { position: relative; display: inline-block; width: auto; max-width: 100%; aspect-ratio: auto; overflow: hidden; border: 3px solid var(--wp--preset--color--paper); box-shadow: 12px 12px 0 var(--wp--preset--color--crimson); background: var(--wp--preset--color--ink-2); animation: artbox-in var(--wp--custom--motion--dur, 380ms) var(--wp--custom--motion--ease-snap, ease) both; }
.artbox__stage.gimg img.artbox__main { position: static; width: auto; height: auto; max-width: 100%; max-height: calc(100vh - 2 * clamp(24px, 5vw, 72px) - 84px); object-fit: contain; border: 0; box-shadow: none; animation: none; display: block; }
.artbox__stage.gimg .c1, .artbox__stage.gimg .c2 { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.artbox__count.sticker { position: absolute; left: clamp(24px, 5vw, 72px); bottom: 14px; }
.artbox__title.gl { text-shadow: var(--wp--custom--motion--offset-riso, 6px) var(--wp--custom--motion--offset-riso, 6px) 0 var(--wp--preset--color--crimson); }
.artbox__tags .sticker.stk { text-decoration: none; }
.artbox__back.breathe::before { opacity: 0.35; }
@media (max-width: 900px) { .artbox__stage.gimg img.artbox__main { max-height: 46vh; } .artbox__stage.gimg { box-shadow: 6px 6px 0 var(--wp--preset--color--crimson); } .artbox__count.sticker { left: 16px; bottom: auto; top: 20px; } }

/* Large view fixes: the breathing backdrop must stay absolute; the big image glitches only when switching, not on hover */
.artbox .artbox__back.breathe { position: absolute; }
.artbox__stage.gimg:hover .c1, .artbox__stage.gimg:hover .c2 { animation: none; opacity: 0; }
.artbox__stage.gimg:hover .base, .artbox__stage.gimg:hover .scanline { animation: none; }
.artbox__stage.gimg.play .c1 { opacity: 1; animation: img-a 900ms steps(1, end) 1; }
.artbox__stage.gimg.play .c2 { opacity: 1; animation: img-b 900ms steps(1, end) 1; }
.artbox__stage.gimg.play .base { animation: img-base 900ms steps(1, end) 1; }
.artbox__stage.gimg.play .scanline { animation: scanline 900ms linear 1; }

/* Large view on phones: the picture gets a fixed share of the height, the info panel scrolls in the rest */
.artbox__stage { flex: none; }
@media (max-width: 900px) {
  .artbox { grid-template-rows: minmax(0, 56vh) minmax(0, 1fr); }
  .artbox__figure { padding: 60px 16px 8px; gap: 10px; }
  .artbox__stage.gimg img.artbox__main { max-height: calc(56vh - 68px - 66px); max-width: calc(100vw - 32px); }
  .artbox__info { max-height: none; padding-top: 8px; }
  .artbox__thumbs button { width: 44px; height: 44px; }
}

/* Large view: the frame animation belongs to the stage, never to the glitch clones */
.artbox__figure .artbox__stage img { border: 0; box-shadow: none; animation: none; }
.artbox .artbox__stage .c1, .artbox .artbox__stage .c2 { opacity: 0; }
.artbox .artbox__stage.gimg.play .c1 { opacity: 1; animation: img-a 900ms steps(1, end) 1; }
.artbox .artbox__stage.gimg.play .c2 { opacity: 1; animation: img-b 900ms steps(1, end) 1; }
.artbox .artbox__stage.gimg.play .base { animation: img-base 900ms steps(1, end) 1; }
.artbox .artbox__stage.gimg.play .scanline { animation: scanline 900ms linear 1; }

/* Section logos (ART Wear, Merch Studio) as tilted plates */
.brand-plate { display: inline-block; margin: 0 0 var(--wp--preset--spacing--30); padding: 14px 20px; background: var(--wp--preset--color--paper); border: 3px solid var(--wp--preset--color--ink); box-shadow: 8px 8px 0 var(--wp--preset--color--crimson); transform: rotate(-2deg); transition: transform 180ms cubic-bezier(.16, 1, .3, 1); }
.brand-plate:hover { transform: rotate(0deg) translate(2px, 2px); }
.brand-plate img { display: block; width: 240px; max-width: 100%; height: auto; }
.brand-plate.is-ink { background: var(--wp--preset--color--ink-2); border-color: var(--wp--preset--color--paper); box-shadow: 8px 8px 0 var(--wp--preset--color--crimson); }
.brand-plate.wp-block-image { margin-bottom: var(--wp--preset--spacing--30); }
@media (max-width: 600px) { .brand-plate img { width: 180px; } }

/* Brand split under the hero: two logo tiles, whole tile is the link */
.brand-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 3px solid var(--wp--preset--color--paper); border-bottom: 3px solid var(--wp--preset--color--paper); }
.brand-tile { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 28px; min-height: clamp(360px, 46vw, 560px); padding: clamp(32px, 5vw, 72px) clamp(20px, 4vw, 56px); text-decoration: none; color: inherit; overflow: hidden; transition: background 220ms cubic-bezier(.16, 1, .3, 1); }
.brand-tile.is-artwear { background: var(--wp--preset--color--paper); color: var(--wp--preset--color--ink); border-right: 3px solid var(--wp--preset--color--ink); }
.brand-tile.is-merch { background: var(--wp--preset--color--ink-2); color: var(--wp--preset--color--paper); }
.brand-tile.is-artwear:hover { background: var(--wp--preset--color--acid); color: var(--wp--preset--color--ink); }
.brand-tile.is-merch:hover { background: var(--wp--preset--color--crimson); color: var(--wp--preset--color--paper); }
.brand-tile__tag { position: absolute; left: clamp(16px, 3vw, 40px); top: clamp(16px, 3vw, 40px); }
.brand-tile__logo.gimg { position: relative; display: block; width: min(600px, 82%); aspect-ratio: auto; overflow: visible; }
.brand-tile__logo.gimg img { position: static; width: 100%; height: auto; object-fit: contain; display: block; }
.brand-tile__logo.gimg .c1, .brand-tile__logo.gimg .c2 { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.brand-tile.is-merch .brand-tile__logo img { filter: drop-shadow(8px 8px 0 var(--wp--preset--color--crimson)); }
.brand-tile.is-artwear .brand-tile__logo img { filter: drop-shadow(8px 8px 0 var(--wp--preset--color--crimson)); }
.brand-tile__cta { color: inherit; font-size: var(--wp--preset--font-size--ui); letter-spacing: 0.06em; text-transform: uppercase; border-bottom: 2px solid currentColor; padding-bottom: 4px; transition: transform 180ms cubic-bezier(.16, 1, .3, 1); }
.brand-tile:hover .brand-tile__cta { transform: translateX(6px); }
.brand-tile:hover .brand-tile__tag { transform: rotate(0deg) scale(1.04); animation-play-state: paused; }
/* the logo glitches when the whole tile is hovered */
.brand-tile:hover .gimg .c1 { opacity: 1; animation: img-a 900ms steps(1, end) infinite; }
.brand-tile:hover .gimg .c2 { opacity: 1; animation: img-b 900ms steps(1, end) infinite; }
.brand-tile:hover .gimg .base { animation: img-base 900ms steps(1, end) infinite; }
.brand-tile:hover .gimg .scanline { animation: scanline 900ms linear infinite; }
/* stamp in on scroll */
.stamp { opacity: 0; transform: scale(1.14) rotate(-3deg); }
.in .stamp, .stamp.in { animation: stamp 620ms cubic-bezier(.16, 1, .3, 1) forwards; }
.brand-tile.is-merch .stamp { animation-delay: 140ms; }
@keyframes stamp { 0% { opacity: 0; transform: scale(1.14) rotate(-3deg); } 60% { opacity: 1; transform: scale(0.97) rotate(1deg); } 100% { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { body:not(.force-motion) .stamp { opacity: 1; transform: none; } }
body.reduced-motion .stamp { opacity: 1; transform: none; }
@media (max-width: 782px) {
  .brand-split { grid-template-columns: 1fr; }
  .brand-tile.is-artwear { border-right: 0; border-bottom: 3px solid var(--wp--preset--color--ink); }
  .brand-tile { min-height: 300px; gap: 20px; }
  .brand-tile__logo.gimg { width: min(420px, 78%); }
}
