/* A single changing color field; chapters remain in the normal page flow. */
:root {
  --motion-reveal: 600ms;
  --motion-heading: 500ms;
  --motion-stagger: 70ms;
  --motion-feedback: 160ms;
  --motion-chapter: 360ms;
}
html.keyboard-navigation { scroll-behavior: auto; }
html.keyboard-navigation .button,
html.keyboard-navigation .ticket-luma,
html.keyboard-navigation .topic-tab,
html.keyboard-navigation .topics-section,
html.keyboard-navigation .topic-navigation,
html.keyboard-navigation .gallery-visual { transition: none; }
html.keyboard-navigation .button:active { transform: none; }
.topics-section {
  --topic-bg: var(--lime);
  --topic-ink: var(--ink);
  --topic-accent: var(--cobalt);
  --topic-on-accent: var(--paper);
  background: var(--topic-bg);
  color: var(--topic-ink);
  padding-top: 0;
  transition: background-color var(--motion-chapter) var(--ease-out), color var(--motion-chapter) var(--ease-out);
}
.topics-section[data-topic="imagenes"] { --topic-bg: var(--pink); --topic-accent: var(--ink); }
.topics-section[data-topic="videos"] { --topic-accent: var(--ink); }
.topics-section[data-topic="web"] { --topic-bg: var(--cobalt); --topic-ink: var(--paper); --topic-accent: var(--paper); --topic-on-accent: var(--cobalt); }
.topics-section[data-topic="presentaciones"] { --topic-bg: var(--cyan); }
.topics-section[data-topic="publicidad"] { --topic-bg: var(--orange); --topic-accent: var(--ink); }
.topics-section[data-topic="3d"] { --topic-bg: var(--lime); }
.topics-section[data-topic="otros"] { --topic-bg: var(--pink); --topic-accent: var(--ink); }
.topics-intro {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  align-items:end;
  gap:32px;
  max-width:1320px;
  margin:0 auto 26px;
  padding:44px 0 10px;
  background:transparent;
  color:inherit;
}
.topics-intro .section-eyebrow { color:inherit; font-size:11px; margin:0 0 16px; }
.topics-intro h2 { margin:0; font-size:clamp(36px,4vw,58px); line-height:.96; letter-spacing:-.06em; font-weight:780; }
.topics-intro .topics-intro-copy { max-width:38ch; margin:0 0 3px; font-size:clamp(14px,1.4vw,18px); line-height:1.5; letter-spacing:-.02em; }
.topic-board {
  --chapter-space: calc(100svh - var(--site-header-height, 64px) - var(--topic-nav-height, 72px) - 16px);
  --chapter-image-height: clamp(9rem, calc((var(--chapter-space) - 12.5rem) / 2), 17rem);
  max-width: 1320px;
  padding: 0;
  background: transparent;
  color: inherit;
}
.topic-navigation {
  top: var(--site-header-height, 64px);
  margin: 0;
  padding: 9px 0;
  background: var(--topic-bg);
  border-color: currentColor;
  transition: background-color var(--motion-chapter) var(--ease-out), color var(--motion-chapter) var(--ease-out);
}
.topic-tab[aria-current="true"] { background: var(--topic-accent); color: var(--topic-on-accent); }
/* Minimum height gives each chapter a screen; content can always grow past it. */
.topic-chapter { display: flow-root; min-height: max(0px, var(--chapter-space)); padding-bottom: 18px; }
.topic-chapter + .topic-chapter { border-color: currentColor; padding-top: 0; }
.topic-heading { margin: 16px 0 14px; gap: 24px; }
.topic-panel-label { margin-bottom: 6px; }
.topic-chapter h3 { font-size: clamp(2rem, 4vw, 3.25rem); }
.topic-chapter[data-topic="presentaciones"] h3 { font-size: clamp(1.6rem, 3.5vw, 2.8rem); }
.topic-summary { max-width: 40ch; margin: 0; font-size: .875rem; line-height: 1.3; }
.topics-note { color: inherit; opacity: .75; }
.topic-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 5px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: thin;
  scrollbar-color: currentColor transparent;
  scroll-behavior: auto;
  padding: 3px;
}
.topic-tab { flex: 1 0 auto; white-space: nowrap; }
.topic-tab:focus-visible { outline: 2px dashed currentColor; outline-offset: -4px; }
.topic-chapter { scroll-margin-top: calc(var(--topic-nav-height, 72px) + 8px); }
.topic-gallery {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  align-items: start;
  gap: 16px clamp(12px, 1.3vw, 18px);
  min-width: 0;
  padding: 0;
}
.gallery-card {
  position: relative;
  grid-column: span 3;
  min-width: 0;
  margin: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.gallery-card:first-child, .gallery-card:nth-child(n+4) { grid-column: span 6; }
.gallery-card:has(.gallery-color:focus-visible) { outline: 3px solid currentColor; outline-offset: 5px; }
.gallery-picture {
  position: relative;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  isolation: isolate;
  background: #080808;
}

.gallery-visual {
  position: absolute;
  inset: 0;
  min-width: 0;
  overflow: hidden;
  container-type: size;
  background: #f5efe2;
  color: #080808;
  filter: grayscale(1);
  transition: filter 260ms var(--ease-out), transform 260ms var(--ease-out);
}
.gallery-visual img { display: block; width: 100%; height: 100%; object-fit: cover; }
.gallery-visual strong, .gallery-visual b { font-weight: 760; }
.gallery-visual small { font-size: 2.7cqi; font-weight: 650; letter-spacing: .03em; }
.gallery-card.is-color .gallery-visual,
.gallery-card:has(.gallery-color:focus-visible) .gallery-visual { filter: grayscale(0); }
.gallery-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  gap: 12px;
  padding: clamp(14px, 1.5vw, 22px);
  color: #fffdf3;
  background: linear-gradient(180deg, transparent 42%, #0003 62%, #000c 100%);
  pointer-events: none;
}
.gallery-overlay h4 {
  max-width: 20ch;
  margin: 0;
  font-size: clamp(20px, 1.75vw, 26px);
  font-weight: 800;
  line-height: .99;
  letter-spacing: -.04em;
  text-wrap: balance;
}
.gallery-caption { color: inherit; padding-top: 6px; }
.gallery-caption p {
  max-width: none;
  margin: 0;
  font-size: .8125rem;
  line-height: 1.3;
  letter-spacing: -.015em;
  color: inherit;
}
@media (hover: hover) and (pointer: fine) {
  .gallery-card:hover .gallery-visual { filter: grayscale(0); transform: scale(1.025); }
  .topic-tab:not([aria-current="true"]):hover { border-color: currentColor; }
}
/* Scenes are artwork within the card, not interactive interfaces. */
.gallery-cinema { position: relative; height: 100%; background: #0a0a0a; }
.gallery-frame { position: absolute; inset: 7%; border: 1px solid #fff5; }
.gallery-storyboard {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 5px;
  height: 100%;
  padding: 8% 5%;
  background: #111;
}
.gallery-storyboard > div { position: relative; min-width: 0; overflow: hidden; }
.gallery-storyboard span { position: absolute; bottom: 6px; left: 6px; color: #fff; font-size: 3cqi; font-weight: 650; }
.gallery-browser { position: absolute; inset: 9% 5%; background: #fff9ec; box-shadow: 0 8px 0 #1422d72b; }
.gallery-browser-bar { height: 13%; display: flex; justify-content: space-between; align-items: center; padding: 0 6%; border-bottom: 1px solid #1112; font-size: 2.7cqi; font-weight: 750; }
.gallery-browser-bar i { font-style: normal; letter-spacing: .14em; }
.gallery-web-product { height: 72%; display: grid; grid-template-columns: .9fr 1.1fr; align-items: stretch; gap: 0; }
.gallery-web-product > div { display: flex; flex-direction: column; align-items: start; justify-content: center; padding: 12% 7% 12% 12%; }
.gallery-web-product strong { margin: 14% 0; font-size: 8.2cqi; line-height: .95; letter-spacing: -.06em; }
.gallery-web-product span { font-size: 2.9cqi; line-height: 1.3; }
.gallery-web-product img { object-position: 54% center; }
.gallery-web-foot { height: 15%; padding: 0 6%; display: flex; align-items: center; justify-content: space-between; border-top: 1px solid #1112; font-size: 2.5cqi; }
.gallery-portfolio { height: 100%; padding: 7% 7% 0; background: #ff7b92; }
.gallery-sitebar { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid currentColor; padding-bottom: 5%; }
.gallery-sitebar strong { font-size: 3.3cqi; line-height: 1; letter-spacing: -.03em; }
.gallery-sitebar span { font-size: 2.5cqi; }
.gallery-portfolio-title { display: block; font-size: 7.5cqi; line-height: .92; letter-spacing: -.065em; margin: 4% 0; }
.gallery-portfolio-image { height: 50%; margin: 0 -8.2%; }
.gallery-portfolio-image img { object-position: center 42%; }
.gallery-editorial { height: 100%; padding: 7%; background: #fff8e8; }
.gallery-editorial-image { height: 50%; margin: 7% 0 5%; background: #080808; }
.gallery-editorial-image img { object-fit: contain; }
.gallery-editorial-foot { display: flex; align-items: end; justify-content: space-between; gap: 5%; }
.gallery-editorial-foot strong { font-size: 7.8cqi; line-height: .95; letter-spacing: -.05em; }
.gallery-editorial-foot span { text-align: right; font-size: 2.5cqi; line-height: 1.3; }
.gallery-slide { position: relative; height: 100%; display: grid; grid-template-columns: 1.1fr 1fr; background: #ffefce; }
.gallery-slide > div:first-child { display: flex; flex-direction: column; justify-content: center; padding: 12% 7% 12% 13%; }
.gallery-slide strong { display: block; margin: 7% 0; font-size: 8cqi; line-height: .92; letter-spacing: -.055em; }
.gallery-slide span { font-size: 2.7cqi; line-height: 1.4; }
.gallery-slide-image { min-width: 0; overflow: hidden; }
.gallery-slide-image img { object-position: 51% center; }
.gallery-slide-number { position: absolute; bottom: 6%; right: 6%; color: #fff; }
.gallery-process { position: relative; height: 100%; padding: 6%; overflow: hidden; background: #1320d7; color: #fff9ed; }
.gallery-process > small, .gallery-process > strong, .gallery-process-steps { position: relative; z-index: 1; }
.gallery-process > strong { display: block; font-size: 8cqi; line-height: .94; letter-spacing: -.06em; margin: 5% 0; }
.gallery-process-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9%; border-top: 1px solid #fff9; padding-top: 3%; }
.gallery-process-steps > div { display: flex; flex-direction: column; gap: 5px; }
.gallery-process-steps b { font-size: 8cqi; line-height: 1; }
.gallery-process-steps span { font-size: 3.1cqi; }
.gallery-process-texture { position: absolute; inset: 0; opacity: .22; mix-blend-mode: screen; }
.gallery-manifesto { height: 100%; padding: 8%; background: #090909; color: #fff5e6; display: flex; flex-direction: column; align-items: start; justify-content: center; gap: 8%; }
.gallery-manifesto img { height: 43%; object-fit: contain; }
.gallery-manifesto strong { font-size: 6cqi; line-height: 1.04; letter-spacing: -.04em; }
.gallery-manifesto small { font-size: 2.3cqi; opacity: .7; }
.gallery-advert { height: 100%; position: relative; overflow: hidden; background: #64ddf0; }
.gallery-advert > strong { position: absolute; z-index: 1; top: 7%; left: 7%; font-size: 9cqi; line-height: .87; letter-spacing: -.07em; color: #1320d7; }
.gallery-advert > img { position: absolute; top: 17%; height: 78%; object-fit: contain; }
.gallery-advert > div { position: absolute; bottom: 6%; left: 7%; right: 7%; display: flex; justify-content: space-between; align-items: end; gap: 8px; }
.gallery-advert span { max-width: 12ch; font-size: 4cqi; line-height: 1.05; font-weight: 750; }
.gallery-advert small { max-width: 14ch; font-size: 2.3cqi; text-align: right; }
.gallery-poster { position: relative; height: 100%; display: grid; place-items: center; padding: 5cqh 0 24cqh; background: var(--cobalt); }
.gallery-poster > div { position: relative; z-index: 1; display: grid; grid-template-rows: minmax(0, 1fr) auto; gap: 3cqh; width: 62%; height: 100%; padding: 4cqh 2cqi; background: var(--cyan); color: var(--cobalt); transform: rotate(-5deg); box-shadow: 7px 7px 0 #05050535; }
.gallery-poster img { min-height: 0; object-fit: contain; }
.gallery-poster small { text-align: center; font-size: min(2.7cqi, 5.5cqh); white-space: nowrap; }
.gallery-lettering { height: 100%; display: flex; align-items: center; padding: 6%; background: #050505; }
.gallery-lettering img { object-fit: contain; }
.gallery-product-study { position: relative; height: 100%; background: #64ddf0; }
.gallery-product-study img { object-position: center 38%; }
.gallery-materials { position: absolute; left: 8%; right: 8%; bottom: 7%; display: flex; justify-content: center; gap: 8%; }
.gallery-materials i { width: 11%; aspect-ratio: 1; background: #1320d7; border-radius: 50%; border: 2px solid #fff9; }
.gallery-materials i:nth-child(2) { background: #ff7a18; }
.gallery-materials i:nth-child(3) { background: #ff168c; }
.gallery-object { position: relative; height: 100%; perspective: 750px; background: #ffd5b1; }
.gallery-object-shadow { position: absolute; left: 27%; top: 80%; width: 55%; height: 10%; border-radius: 50%; background: #321b6133; filter: blur(9px); transform: rotate(-9deg); }
.gallery-box { position: absolute; left: 26%; top: 17%; width: 46%; height: 65%; transform-style: preserve-3d; transform: rotateX(-13deg) rotateY(-29deg) rotateZ(-5deg); }
.gallery-box-front { position: absolute; inset: 0; background: #fff5df; transform: translateZ(28px); border: 1px solid #e1d3b8; }
.gallery-box-front img { height: 78%; padding: 9%; object-fit: contain; }
.gallery-box-front small { position: absolute; bottom: 8%; left: 8%; right: 8%; font-size: 2.4cqi; letter-spacing: .09em; text-align: center; }
.gallery-box-side { position: absolute; right: -28px; top: 0; width: 56px; height: 100%; background: #1320d7; transform: rotateY(90deg); display: grid; place-items: center; color: #fff6dc; }
.gallery-box-side strong { font-size: 7.3cqi; transform: rotate(90deg); white-space: nowrap; }
.gallery-box-top { position: absolute; left: 0; top: -28px; width: 100%; height: 56px; background: #ff168c; transform: rotateX(90deg); }
.gallery-flow { position: relative; height: 100%; padding: 8%; background: #fff5df; overflow: hidden; }
.gallery-flow-steps { display: flex; align-items: center; justify-content: space-between; gap: 3%; margin-top: 8%; font-size: 5.3cqi; font-weight: 720; letter-spacing: -.04em; }
.gallery-flow-steps span { padding-bottom: 4%; border-bottom: 2px solid #ff168c; }
.gallery-flow-steps i { font-style: normal; font-size: 4cqi; }
.gallery-flow-image { position: absolute; right: -5%; bottom: -5%; width: 68%; height: 59%; transform: rotate(-6deg); }
.gallery-flow-image img { object-position: center; }
.gallery-flow > strong { position: absolute; left: 8%; bottom: 10%; z-index: 1; max-width: 10ch; font-size: 9.7cqi; line-height: .91; letter-spacing: -.06em; }
.gallery-statement { position: relative; height: 100%; background: #080808; color: #fff7e5; }
.gallery-statement img { opacity: .4; }
.gallery-statement > strong { position: absolute; inset: 9%; display: flex; align-items: center; font-size: 15.5cqi; letter-spacing: -.075em; line-height: .9; }
@media (max-width: 760px) {
  .topics-intro { grid-template-columns:1fr; gap:18px; padding:30px 0 12px; margin-bottom:14px; }
  .topics-intro h2 { font-size:40px; }
  .topics-intro .section-eyebrow { font-size:10px; margin-bottom:14px; }
  .topics-intro .topics-intro-copy { max-width:38ch; font-size:14px; }
  .topic-navigation { margin: 0; padding: 6px 0; }
  .topic-tabs { display: flex; gap: 4px; }
  .topic-tab { flex: 0 0 auto; min-height: 44px; padding: 10px 13px; font-size: 13px; }
  .topic-board {
    --chapter-space: calc(100svh - var(--site-header-height, 56px) - var(--topic-nav-height, 64px) - 16px);
    --chapter-lead-height: clamp(8rem, calc((var(--chapter-space) - 14.5rem) * .38), 12rem);
    --chapter-tile-height: clamp(6.25rem, calc((var(--chapter-space) - 14.5rem) * .31), 9rem);
  }
  .topic-heading { gap: 6px; margin: 16px 0 14px; }
  .topic-panel-label { margin-bottom: 6px; }
  .topic-chapter h3 { font-size: clamp(2.125rem, 9vw, 2.5rem); }
  .topic-chapter[data-topic="presentaciones"] h3 { font-size: clamp(1.5rem, 7.1vw, 1.8rem); }
  .topic-summary { min-height: 0; max-width: 40ch; font-size: .8125rem; line-height: 1.3; }
  .topic-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items:start; gap: 14px 12px; }
  .gallery-card, .gallery-card:nth-child(n+4) { grid-column: span 1; }
  .gallery-card:first-child { grid-column: 1 / -1; }
  .gallery-picture { height: var(--chapter-tile-height); aspect-ratio: auto; }
  .gallery-card:first-child .gallery-picture { height: var(--chapter-lead-height); aspect-ratio: auto; }
  .gallery-overlay { padding: 12px; gap: 8px; }
  .gallery-overlay h4 { font-size: clamp(1rem, 4.25vw, 1.125rem); max-width: 16ch; line-height: 1.04; }
  .gallery-card:first-child .gallery-overlay h4 { font-size: clamp(1.5rem, 5.5vw, 1.75rem); max-width: 20ch; }
  .gallery-caption p { max-width: none; font-size: .75rem; line-height: 1.3; }
}
@media (max-width: 360px) {
  .topic-tabs { display: flex; }
  .topic-tab { padding: 10px 11px; font-size: 12px; }
  .gallery-overlay { padding: 10px; }
  .gallery-overlay h4 { font-size: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .gallery-visual, .topics-section, .topic-navigation, .topic-tab { transition: none; }
  .gallery-card:hover .gallery-visual { transform: none; }
}
.motion-paused .gallery-visual, .motion-paused .topics-section, .motion-paused .topic-navigation, .motion-paused .topic-tab { transition: none; }
.motion-paused .gallery-card:hover .gallery-visual { transform: none; }
@media print {
  .topic-navigation { position: static; }
  .topic-tabs { overflow: visible; flex-wrap: wrap; }
  .topic-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gallery-card { break-inside: avoid; }
  .gallery-picture, .gallery-card:first-child .gallery-picture { aspect-ratio: 4 / 5; }
}

/* Examples read as finished pieces, with one title and a short caption. */
.gallery-color { position:absolute; inset:0; z-index:3; width:100%; height:100%; padding:0; border:0; border-radius:0; background:transparent; cursor:pointer; color:inherit; }
.gallery-color:focus { outline:none; }
.gallery-scene-website,.gallery-scene-portfolio,.gallery-scene-editorial,.gallery-scene-slide,.gallery-scene-process,.gallery-scene-manifesto,.gallery-scene-flow,.gallery-scene-statement { bottom:22%; }
.gallery-card:has(.gallery-scene-website) .gallery-overlay,
.gallery-card:has(.gallery-scene-portfolio) .gallery-overlay,
.gallery-card:has(.gallery-scene-editorial) .gallery-overlay,
.gallery-card:has(.gallery-scene-slide) .gallery-overlay,
.gallery-card:has(.gallery-scene-process) .gallery-overlay,
.gallery-card:has(.gallery-scene-manifesto) .gallery-overlay,
.gallery-card:has(.gallery-scene-flow) .gallery-overlay,
.gallery-card:has(.gallery-scene-statement) .gallery-overlay { background:linear-gradient(transparent 65%,#080808 82%); padding-bottom:12px; }
.gallery-browser { inset:5%; box-shadow:none; }
.gallery-web-foot { display:none; }
.gallery-web-product { height:87%; }
.gallery-web-product > div { padding:8%; }
.gallery-web-product small,.gallery-web-product span,.gallery-sitebar span,.gallery-editorial-foot span,.gallery-slide span,.gallery-slide-number { display:none; }
.gallery-web-product strong { font-size:min(8cqi,27cqh); margin:0; }
.gallery-portfolio-title { font-size:6.4cqi; margin:3% 0; }
.gallery-portfolio-image { height:62%; }
.gallery-manifesto { padding:6%; }
.gallery-manifesto img { height:100%; }
.gallery-advert > img { inset:0; width:100%; height:100%; object-fit:cover; }
.gallery-advert > strong { font-size:9cqi; color:var(--paper); text-shadow:0 1px 12px #0006; }
.gallery-statement > strong { font-size:12cqi; }
.gallery-flow-image { height:62%; width:58%; transform:none; }
.gallery-flow-steps { position:relative; z-index:1; }
/* Wide examples keep their lettering within the artwork's height as well as width. */
.gallery-slide>div:first-child { padding:8cqh 4cqi; }
.gallery-slide strong { font-size:min(8cqi,21cqh); margin:4cqh 0; }
.gallery-slide small, .gallery-flow>small { font-size:min(2.7cqi,6cqh); }
.gallery-flow { padding:7cqh 8cqi; }
.gallery-flow-steps { margin-top:6cqh; font-size:min(5.3cqi,17cqh); }
.gallery-statement>strong { font-size:min(12cqi,27cqh); }
@media(max-width:760px){
 .gallery-card:not(:first-child) .gallery-overlay { padding:10px; }
 .gallery-card:has(.gallery-scene-website) .gallery-overlay,
 .gallery-card:has(.gallery-scene-portfolio) .gallery-overlay,
 .gallery-card:has(.gallery-scene-editorial) .gallery-overlay,
 .gallery-card:has(.gallery-scene-slide) .gallery-overlay,
 .gallery-card:has(.gallery-scene-process) .gallery-overlay,
 .gallery-card:has(.gallery-scene-manifesto) .gallery-overlay,
 .gallery-card:has(.gallery-scene-flow) .gallery-overlay,
 .gallery-card:has(.gallery-scene-statement) .gallery-overlay { background:linear-gradient(transparent 50%,#080808 80%); }
}

.gallery-process-steps { margin-top:7%; padding-top:5%; }

/* Five pieces in two rows. The media shrinks with the viewport, never the copy. */
@media(min-width:761px){
 .gallery-card .gallery-picture { height:var(--chapter-image-height); aspect-ratio:auto; }
 .gallery-card:first-child .gallery-overlay h4 { font-size:clamp(1.5rem,2.2vw,2rem); }
}
@media(min-width:761px) and (max-width:1023px){
 .gallery-card:not(:first-child) .gallery-overlay { padding:12px; }
 .gallery-card:not(:first-child) .gallery-overlay h4 { font-size:1.0625rem; }
 .gallery-caption p { font-size:.75rem; }
}
.gallery-picture { transition:transform var(--motion-feedback) var(--ease-out); }
.gallery-color:active { background:#ffffff08; }

@media(hover:none) and (pointer:coarse) and (prefers-reduced-motion:no-preference){
 html:not(.motion-paused):not(.keyboard-navigation) .gallery-card:has(.gallery-color:active) .gallery-picture { transform:scale(.985); }
}
.motion-paused .gallery-picture,
.keyboard-navigation .gallery-picture { transition:none; }
@media(prefers-reduced-motion:reduce){.gallery-picture{transition:none}}
@media(min-width:600px) and (max-width:760px){
 .topics-intro { grid-template-columns:1fr 1fr; align-items:end; gap:25px; }
 .topic-heading { grid-template-columns:1fr 1fr; gap:25px; }
}

/* Distinct campaign examples leave the main slogan for the closing invitation. */
.gallery-manifesto{position:relative;background:var(--cobalt);color:var(--lime);padding:8%;overflow:hidden;isolation:isolate}
.gallery-manifesto strong{position:relative;z-index:1;font-size:12cqi;line-height:.92;letter-spacing:-.06em;max-width:8ch}
.gallery-manifesto>div{position:absolute;inset:0 0 0 40%;opacity:.3;z-index:-1}
.gallery-manifesto img{height:100%;object-fit:cover}
.gallery-lettering{justify-content:center;align-items:start;padding:3% 4% 13%}
.gallery-phrase-agente{height:100%;max-width:100%;aspect-ratio:1;background-image:url("landing-assets/v16/frases-chicha.webp");background-repeat:no-repeat;background-size:312.83% 208.55%;background-position:1.34% 96.81%}

/* These are static creative examples: no player, fake controls or looping scenes. */
.gallery-avatar, .gallery-staging { position:relative; height:100%; }
.gallery-avatar img { object-position:60% 38%; }
.gallery-avatar-label { position:absolute; left:6%; top:7%; max-width:30%; padding:6cqh 4cqi; background:var(--cyan); color:var(--ink); }
.gallery-avatar-label small { display:block; font-size:min(2.1cqi,5.5cqh); margin-bottom:4cqh; }
.gallery-avatar-label strong { display:block; font-size:min(5cqi,17cqh); line-height:.96; letter-spacing:-.05em; }
.gallery-tour { display:grid; grid-template-columns:1.8fr 1fr; gap:1.4%; height:100%; background:var(--paper); }
.gallery-tour-main, .gallery-tour-detail { min-width:0; overflow:hidden; }
.gallery-tour-detail img { width:170%; max-width:none; object-position:80% 50%; transform:translateX(-24%); }
.gallery-composition-frame { position:absolute; inset:8%; border:1px solid #fff9; }
.gallery-composition-frame::before, .gallery-composition-frame::after { content:""; position:absolute; top:0; bottom:0; left:33.33%; border-left:1px solid #fff4; }
.gallery-composition-frame::after { left:66.66%; }
.gallery-product-story { display:grid; grid-template-columns:1fr 1fr 1fr; gap:2%; padding:5cqh 4cqi 20cqh; height:100%; background:var(--ink); }
.gallery-product-story>div { position:relative; min-width:0; overflow:hidden; }
.gallery-product-story>div:nth-child(2) img { width:190%; max-width:none; transform:translateX(-23%); }
.gallery-product-story>div:nth-child(3) img { object-position:75% center; }
.gallery-product-story small { position:absolute; top:5%; left:8%; color:var(--paper); font-size:3cqi; }
.gallery-moodboard { display:grid; grid-template-columns:1.7fr 1fr; grid-template-rows:minmax(0,1fr) minmax(0,.45fr); gap:4%; height:100%; padding:6cqh 5cqi 32cqh; background:var(--paper); }
.gallery-moodboard-main { grid-row:1 / 3; min-height:0; }
.gallery-moodboard-reference { min-height:0; }
.gallery-palette { display:flex; }
.gallery-palette i { flex:1; background:var(--cobalt); }
.gallery-palette i:nth-child(2) { background:var(--orange); }
.gallery-palette i:nth-child(3) { background:var(--cyan); }
.gallery-moodboard>small { position:absolute; bottom:23%; left:5%; font-size:min(2.5cqi,5.5cqh); }
.gallery-print { position:relative; height:100%; display:flex; align-items:center; justify-content:center; gap:8%; padding:7cqh 9cqi 21cqh; background:var(--orange); }
.gallery-print-paper { display:grid; grid-template-rows:minmax(0,1fr) auto; gap:3cqh; height:100%; aspect-ratio:.85; max-width:45%; padding:3cqh 1cqi; background:var(--cyan); color:var(--cobalt); transform:rotate(-5deg); box-shadow:8px 8px 0 #05050525; }
.gallery-print-paper img { min-height:0; object-fit:contain; }
.gallery-print-paper small { text-align:center; font-size:min(2.3cqi,5.5cqh); white-space:nowrap; }
.gallery-print-mark { color:var(--cobalt); font-size:min(8.5cqi,22cqh); font-weight:850; letter-spacing:-.065em; line-height:.88; }

.gallery-scene-event-site, .gallery-scene-catalog, .gallery-scene-report, .gallery-scene-lesson,
.gallery-scene-voice, .gallery-scene-prompt-library, .gallery-scene-brand-system { bottom:23%; }
.gallery-card:has(.gallery-scene-event-site) .gallery-overlay,
.gallery-card:has(.gallery-scene-catalog) .gallery-overlay,
.gallery-card:has(.gallery-scene-report) .gallery-overlay,
.gallery-card:has(.gallery-scene-lesson) .gallery-overlay,
.gallery-card:has(.gallery-scene-voice) .gallery-overlay,
.gallery-card:has(.gallery-scene-prompt-library) .gallery-overlay,
.gallery-card:has(.gallery-scene-brand-system) .gallery-overlay { background:linear-gradient(transparent 55%,#080808 81%); }
.gallery-event-site { height:100%; display:grid; grid-template-rows:auto minmax(0,1fr); gap:4cqh; padding:6cqh 5cqi; background:var(--cyan); color:var(--cobalt); }
.gallery-event-site .gallery-sitebar, .gallery-catalog .gallery-sitebar { padding-bottom:4cqh; }
.gallery-event-site .gallery-sitebar strong, .gallery-catalog .gallery-sitebar strong { font-size:min(3.3cqi,8cqh); }
.gallery-event-body { min-height:0; display:grid; grid-template-columns:1.2fr 1fr; gap:5%; align-items:center; }
.gallery-event-body>div { min-width:0; }
.gallery-event-body strong { display:block; margin:2cqh 0; font-size:min(8cqi,18cqh); line-height:.93; letter-spacing:-.06em; }
.gallery-event-body small { font-size:min(2.7cqi,5.5cqh); }
.gallery-event-body span { font-size:min(2.4cqi,5.5cqh); font-weight:750; }
.gallery-event-body img { object-fit:contain; min-height:0; max-height:100%; }
.gallery-catalog { height:100%; display:grid; grid-template-rows:auto minmax(0,1fr); gap:5cqh; padding:6cqh 5cqi; background:var(--paper); }
.gallery-catalog-items { min-height:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4%; }
.gallery-catalog-items>div { min-height:0; display:grid; grid-template-rows:minmax(0,1fr) auto; gap:3cqh; }
.gallery-catalog-items img { min-height:0; }
.gallery-catalog-items small { display:block; font-size:min(2.4cqi,6cqh); }
.gallery-report { height:100%; display:grid; grid-template-columns:1.1fr 1fr; gap:6%; align-items:center; padding:8cqh 7cqi; color:var(--paper); background:var(--cobalt); }
.gallery-report strong { display:block; font-size:min(7.2cqi,23cqh); line-height:.98; letter-spacing:-.05em; margin-top:5cqh; }
.gallery-report small { font-size:min(2.2cqi,5.5cqh); }
.gallery-report-chart { display:flex; align-items:end; gap:8%; height:78%; padding-bottom:4cqh; border-bottom:1px solid currentColor; }
.gallery-report-chart i { flex:1; height:22%; background:var(--cyan); }
.gallery-report-chart i:nth-child(2) { height:39%; }
.gallery-report-chart i:nth-child(3) { height:55%; }
.gallery-report-chart i:nth-child(4) { height:46%; }
.gallery-report-chart i:nth-child(5) { height:82%; background:var(--pink); }
.gallery-lesson { height:100%; display:grid; grid-template-columns:1.1fr 1fr; gap:6%; padding:7cqh 6cqi; background:var(--pink); color:var(--ink); }
.gallery-lesson>div:first-child { display:flex; flex-direction:column; justify-content:center; }
.gallery-lesson small { font-size:min(2.7cqi,5.5cqh); }
.gallery-lesson strong { font-size:min(8cqi,21cqh); line-height:.97; letter-spacing:-.05em; margin-top:4cqh; }
.gallery-lesson-sheet { min-height:0; padding:4cqh 2cqi; background:var(--paper); transform:rotate(3deg); }
.gallery-lesson-sheet img { height:82%; object-position:75% center; }
.gallery-lesson-sheet span { display:block; font-size:min(2.1cqi,5.5cqh); font-weight:700; margin-top:3cqh; }
.gallery-billboard { position:relative; height:100%; padding:5cqh 4cqi; background:var(--ink); }
.gallery-billboard>img { position:absolute; inset:0; opacity:.48; }
.gallery-billboard-panel { position:relative; z-index:1; height:82%; width:72%; margin:0 auto; padding:5cqh 7cqi; background:var(--lime); color:var(--ink); transform:rotate(-3deg); border:4px solid var(--ink); box-shadow:8px 10px 0 #05050570; }
.gallery-billboard-panel strong { display:block; font-size:min(8cqi,18cqh); line-height:.9; letter-spacing:-.065em; }
.gallery-billboard-panel span { display:block; margin-top:3cqh; font-size:min(2cqi,4.5cqh); font-weight:700; }
.gallery-social-series { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:4%; height:100%; padding:7cqh 7cqi 23cqh; background:var(--paper); }
.gallery-social-series>div { position:relative; min-height:0; overflow:hidden; padding:3cqh 2cqi; background:var(--orange); color:var(--ink); transform:rotate(-3deg); }
.gallery-social-series>div:nth-child(2) { background:var(--cyan); transform:rotate(2deg); }
.gallery-social-series>div:nth-child(3) { background:var(--pink); transform:rotate(-1deg); }
.gallery-social-series strong { position:relative; z-index:1; display:block; font-size:min(5.5cqi,15cqh); line-height:.96; letter-spacing:-.05em; margin-top:5cqh; }
.gallery-social-series small { position:relative; z-index:1; font-size:min(2.5cqi,6cqh); }
.gallery-social-series img { position:absolute; inset:auto 0 0; height:55%; object-position:70% center; mix-blend-mode:multiply; }
.gallery-social-series>div:nth-child(2) img { height:100%; opacity:.35; }

.gallery-set-design { position:relative; height:100%; padding:6cqh 5cqi; background:var(--cobalt); }
.gallery-set-image { height:76%; width:76%; margin-left:auto; }
.gallery-floor-plan { position:absolute; left:6%; bottom:19%; width:34%; height:51%; display:grid; grid-template-columns:1.2fr 1fr; grid-template-rows:1fr 1fr; padding:4cqh 2cqi; background:var(--paper); box-shadow:6px 6px 0 #05050550; transform:rotate(-5deg); }
.gallery-floor-plan i { border:2px solid var(--cobalt); margin:1px; }
.gallery-floor-plan i:first-child { grid-row:1/3; border-bottom-width:6px; }
.gallery-set-design>small { position:absolute; left:45%; bottom:26%; font-size:min(2.3cqi,5.5cqh); color:var(--paper); }
.gallery-exhibition { height:100%; display:grid; grid-template-columns:1fr 1.7fr; gap:2%; padding:6cqh 0 23cqh 6cqi; background:var(--paper); color:var(--cobalt); }
.gallery-exhibition>div { align-self:center; }
.gallery-exhibition small { font-size:min(2.7cqi,5.5cqh); }
.gallery-exhibition strong { display:block; font-size:min(7.3cqi,18cqh); line-height:.92; letter-spacing:-.05em; margin-top:4cqh; }
.gallery-exhibition img { object-position:60% center; }
.gallery-voice { height:100%; padding:7cqh 7cqi; color:var(--cyan); background:var(--cobalt); }
.gallery-voice strong { display:block; margin-top:5cqh; font-size:min(8cqi,19cqh); line-height:.98; letter-spacing:-.05em; color:var(--paper); }
.gallery-waveform { display:flex; align-items:center; gap:2.6%; height:27%; margin-top:7cqh; }
.gallery-waveform i { flex:1; min-height:3px; background:var(--cyan); border-radius:2px; }
.gallery-waveform i:nth-child(3n) { background:var(--pink); }
.gallery-prompt-library { position:relative; height:100%; padding:6%; background:var(--orange); }
.gallery-prompt-library>div { position:absolute; inset:8% 16% 9% 8%; padding:6cqh 5cqi; background:var(--paper); box-shadow:3px 4px 0 #05050530; transform:rotate(-6deg); }
.gallery-prompt-library>div:nth-child(2) { inset:13% 11% 8% 13%; background:var(--cyan); transform:rotate(3deg); }
.gallery-prompt-library>div:nth-child(3) { inset:20% 7% 5% 17%; background:var(--lime); transform:rotate(-2deg); }
.gallery-prompt-library strong { display:block; font-size:min(7.5cqi,20cqh); line-height:.95; letter-spacing:-.05em; margin-top:4cqh; }
.gallery-prompt-library span { display:block; font-size:min(2.4cqi,5.5cqh); margin-top:4cqh; }
.gallery-brand-system { height:100%; display:grid; grid-template-columns:1.15fr 1fr; grid-template-rows:minmax(0,1fr) minmax(0,.22fr); gap:5%; padding:6cqh 5cqi; background:var(--paper); }
.gallery-brand-poster { position:relative; min-height:0; grid-row:1/3; overflow:hidden; background:var(--pink); }
.gallery-brand-poster img { object-position:65% center; mix-blend-mode:multiply; }
.gallery-brand-poster strong { position:absolute; inset:auto 6% 7%; font-size:min(5.2cqi,15cqh); line-height:.94; letter-spacing:-.05em; }
.gallery-brand-type { min-height:0; padding:4cqh 3cqi; color:var(--cobalt); background:var(--cyan); }
.gallery-brand-type small { font-size:min(2.7cqi,5.5cqh); }
.gallery-brand-type strong { display:block; font-size:min(10cqi,24cqh); line-height:.95; letter-spacing:-.08em; margin-top:3cqh; }
.gallery-brand-palette { display:flex; }
.gallery-brand-palette i { flex:1; background:var(--cobalt); }
.gallery-brand-palette i:nth-child(2) { background:var(--pink); }
.gallery-brand-palette i:nth-child(3) { background:var(--orange); }
.gallery-brand-palette i:nth-child(4) { background:var(--cyan); }
@media(max-width:760px){
 .gallery-billboard-panel { width:84%; border-width:2px; }
 .gallery-print-mark { font-size:min(9cqi,22cqh); }
}
@media print{
 .topic-chapter { min-height:0; }
 .gallery-card, .gallery-card:first-child, .gallery-card:nth-child(n+4) { grid-column:auto; }
 .gallery-card .gallery-picture, .gallery-card:first-child .gallery-picture, .gallery-card:nth-child(n+4) .gallery-picture { height:auto; aspect-ratio:4/3; }
}
