@font-face { font-family: 'Barlow Condensed'; font-style: normal; font-weight: 900; font-display: swap; src: url('/__l5e/assets-v1/c85851ca-bff2-4afc-9f59-c7da5514008e/barlow-condensed-900.ttf') format('truetype'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 400; font-display: swap; src: url('/__l5e/assets-v1/6c2e54b2-1e46-4498-84b5-17d3d53054e5/space-grotesk-400.ttf') format('truetype'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 500; font-display: swap; src: url('/__l5e/assets-v1/7559abea-c8e3-4b2c-8577-dc40d1295dc8/space-grotesk-500.ttf') format('truetype'); }
@font-face { font-family: 'Space Grotesk'; font-style: normal; font-weight: 700; font-display: swap; src: url('/__l5e/assets-v1/92ea5736-b43e-4e60-8c40-9156a9b25234/space-grotesk-700.ttf') format('truetype'); }
:root {
  color-scheme: dark;
  --bg: #0c0c0d;
  --surface: #141415;
  --surface-up: #1c1c1e;
  --line: #303033;
  --white: #f7f4ec;
  --muted: #bcb8b0;
  --accent: #ff624b;
  --accent-dark: #26100d;
  --cobalt: #303ac8;
  --display: "Barlow Condensed", "Arial Narrow", Impact, "Arial Black", sans-serif;
  --sans: "Space Grotesk", "Aptos", "Helvetica Neue", Arial, sans-serif;
  --max: 1184px;
  --space: clamp(1rem, 4vw, 2.25rem);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { min-height: 100%; background: var(--bg); }
body {
  min-width: 290px;
  margin: 0;
  color: var(--white);
  font: 400 1rem/1.5 var(--sans);
  -webkit-tap-highlight-color: transparent;
  -webkit-text-size-adjust: 100%;
}
button, input, select, textarea { font: inherit; }
button, a, input, select, textarea { touch-action: manipulation; }
button { color: inherit; cursor: pointer; }
a { color: inherit; text-underline-offset: .2em; }
a:hover { text-decoration-thickness: 2px; }
button:disabled { cursor: not-allowed; opacity: .6; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
p, h1, h2, h3, h4 { margin: 0; }
img, svg { display: block; }
img { max-width: 100%; }
svg { flex: none; }
::selection { color: var(--bg); background: var(--accent); }

.app-shell {
  width: min(100%, var(--max));
  min-height: 100svh;
  margin: 0 auto;
  padding: env(safe-area-inset-top) max(var(--space), env(safe-area-inset-right)) calc(6.5rem + env(safe-area-inset-bottom)) max(var(--space), env(safe-area-inset-left));
}
.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 4.7rem;
  gap: 1rem;
}
.brand {
  display: inline-flex;
  gap: .5rem;
  align-items: center;
  min-height: 44px;
  padding: 0;
  border: 0;
  text-decoration: none;
  text-align: left;
  background: transparent;
}
.brand-mark, .brand-name, .brand strong, .brand b {
  font: 900 2rem/.9 var(--display);
  letter-spacing: 0;
}
.brand small, .brand-label {
  color: var(--muted);
  font-size: .6rem;
  font-weight: 750;
  line-height: 1.05;
  letter-spacing: 0;
  text-transform: uppercase;
}
.top-actions { display: flex; align-items: center; gap: .45rem; }
.icon-button {
  display: grid;
  place-items: center;
  width: 44px;
  min-width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: .65rem;
  color: var(--white);
  background: var(--surface);
}
.icon-button svg { width: 19px; height: 19px; }
.icon-button:hover { border-color: var(--muted); }

.main-content { min-width: 0; }
.view { animation: reveal .25s ease both; }
@keyframes reveal {
  from { transform: translateY(5px); opacity: .64; }
  to { transform: translateY(0); opacity: 1; }
}
.hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: end;
  min-height: min(108vw, 33rem);
  overflow: hidden;
  border: 1px solid #4b2b26;
  border-radius: 1.15rem;
  background: #21110f;
}
.hero-art {
  position: absolute;
  z-index: -1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 91% 16%, #ff8061 0, #ff4d32 19%, #9e2920 38%, transparent 65%),
    radial-gradient(ellipse at 30% 0%, #5e211b 0, #1f100e 58%, #140e0c 83%);
}
.hero-art::before {
  content: "";
  position: absolute;
  inset: -14%;
  opacity: .48;
  transform: rotate(-19deg) scale(1.12);
  background:
    repeating-linear-gradient(90deg, transparent 0 25px, #ffeece28 26px 27px, transparent 28px 29px),
    repeating-linear-gradient(0deg, transparent 0 25px, #ffeece28 26px 27px, transparent 28px 29px);
  mask-image: radial-gradient(ellipse at 78% 34%, black, transparent 64%);
}
.hero-art::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 5%, #150c0b12 35%, #160d0bf2 94%),
    repeating-linear-gradient(116deg, #fce2c108 0 1px, transparent 1px 5px);
}
.hero-art > span {
  position: absolute;
  top: 8%;
  right: -8%;
  width: min(79vw, 29rem);
  aspect-ratio: 1;
  border: 1px solid #ffc6a28c;
  border-radius: 50%;
  transform: rotate(-33deg) scaleY(.76);
  box-shadow: 0 0 0 13px #fbd3b32e, 0 0 0 36px #ffc7a126, 0 0 0 67px #ffd1aa24, 0 0 0 104px #fbe4bf17;
}
.hero-index {
  position: absolute;
  top: 1rem;
  right: 1rem;
  padding: .27rem .46rem;
  border: 1px solid #ffe7d955;
  border-radius: .3rem;
  color: var(--white);
  background: #21100dde;
  font-size: .63rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}
.hero-stripe {
  display: inline-block;
  width: 2.4rem;
  height: 3px;
  margin: 0 0 .65rem;
  background: var(--accent);
}
.hero-content {
  position: relative;
  width: 100%;
  max-width: 45rem;
  padding: clamp(1.15rem, 4vw, 3.5rem);
}
.eyebrow, .card-kicker, .kicker {
  color: var(--accent);
  font-size: .67rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0;
  text-transform: uppercase;
}
.hero-title {
  max-width: 9.5em;
  margin: .35rem 0 .75rem;
  color: var(--white);
  font: 900 2.8rem/.86 var(--display);
  letter-spacing: 0;
  text-transform: uppercase;
  text-wrap: balance;
}
.hero-title > span { display: block; }
.hero-title em { color: var(--accent); font-style: normal; }
.hero-copy { max-width: 31rem; color: #e5d9d0; font-size: .9rem; line-height: 1.4; }
.button-row, .dialog-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
}
.hero .button-row { margin-top: 1.05rem; }
.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  min-height: 44px;
  padding: .65rem .95rem;
  border: 1px solid var(--line);
  border-radius: .65rem;
  color: var(--white);
  background: var(--surface-up);
  font-size: .84rem;
  font-weight: 750;
  line-height: 1.1;
  text-align: center;
  text-decoration: none;
  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}
.button svg { width: 16px; height: 16px; }
.button:hover { border-color: var(--muted); }
.button:active, .icon-button:active { transform: scale(.98); }
.button-primary { border-color: var(--accent); color: #160b09; background: var(--accent); }
.button-primary:hover { border-color: #ff8a78; background: #ff8a78; }
.button-secondary { border-color: #666166; background: #19171ae8; }
.hero .button-secondary { border-color: #9b655a; background: #271513ce; }

.section { margin-top: clamp(1.4rem, 5vw, 2.85rem); }
.section-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .85rem;
}
.section-title {
  font: 900 1.75rem/.96 var(--display);
  letter-spacing: 0;
  text-wrap: balance;
}
.section-heading .eyebrow { margin-bottom: .35rem; }
.section-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .1rem 0;
  border: 0;
  color: var(--muted);
  background: transparent;
  font-size: .79rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
}
.section-link:hover { color: var(--white); }
.card-grid, .gallery-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.55rem, 2.2vw, 1.15rem);
}
.editorial-card, .gallery-card {
  position: relative;
  display: block;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--line);
  border-radius: .85rem;
  color: var(--white);
  background: var(--surface);
  text-align: left;
}
.editorial-card:is(button, a):hover, .gallery-card:is(button, a):hover { border-color: var(--muted); }
.card-art, .gallery-art {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  min-height: 6rem;
  aspect-ratio: 1.8;
  overflow: hidden;
  color: #fff5e9;
  background: #282523;
}
.card-art > *, .gallery-art > * { position: relative; z-index: 1; }
.card-art::before, .gallery-art::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background: repeating-linear-gradient(118deg, #ffffff15 0 1px, transparent 1px 6px);
  mask-image: linear-gradient(150deg, black, transparent 85%);
}
.card-art svg, .gallery-art svg { width: 2rem; height: 2rem; }
.art-nota, .art-note { background: radial-gradient(ellipse at 80% 20%, #d55d43, #7d281e 75%); }
.art-estudio, .art-studio { background: radial-gradient(ellipse at 84% 10%, #565dda, #252884 75%); }
.art-gira, .art-tour { background: radial-gradient(ellipse at 78% 14%, #d58654, #614126 75%); }
.art-preguntas, .art-questions { background: radial-gradient(ellipse at 86% 20%, #796d91, #36283b 80%); }
.card-body, .gallery-caption { display: block; padding: .75rem .7rem .85rem; }
.card-kicker { display: block; margin-bottom: .38rem; color: var(--accent); font-size: .59rem; }
.card-title {
  display: block;
  font: 850 1.02rem/1.02 var(--sans);
  letter-spacing: 0;
  text-wrap: balance;
}
.card-copy { display: block; margin-top: .33rem; color: var(--muted); font-size: .75rem; line-height: 1.3; }

.bottom-nav {
  position: fixed;
  z-index: 5;
  right: 0;
  bottom: 0;
  left: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .16rem;
  width: min(100%, 39rem);
  margin-inline: auto;
  padding: .36rem max(.55rem, env(safe-area-inset-right)) max(.36rem, env(safe-area-inset-bottom)) max(.55rem, env(safe-area-inset-left));
  border: 1px solid var(--line);
  border-width: 1px 0 0;
  background: #111112f5;
  box-shadow: 0 -12px 35px #05050566;
  backdrop-filter: blur(18px);
}
.nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .23rem;
  min-width: 0;
  min-height: 52px;
  padding: .23rem .1rem;
  border: 1px solid transparent;
  border-radius: .55rem;
  color: var(--muted);
  background: transparent;
  font-size: .7rem;
  font-weight: 750;
  line-height: 1;
  text-align: center;
  text-decoration: none;
}
.nav-item svg { width: 18px; height: 18px; }
.nav-item[aria-current="page"], .nav-item[aria-selected="true"], .nav-item.active, .nav-item.is-active {
  border-color: #7f3227;
  color: var(--white);
  background: #38201c;
}
.nav-item[aria-current="page"] svg, .nav-item[aria-selected="true"] svg, .nav-item.active svg, .nav-item.is-active svg { color: var(--accent); }
.nav-item:hover { color: var(--white); }

.dialog {
  width: min(calc(100% - 1.5rem), 35rem);
  max-height: min(87dvh, 48rem);
  margin: auto;
  overflow: auto;
  padding: 0;
  border: 1px solid #49474c;
  border-radius: 1.12rem;
  color: var(--white);
  background: var(--surface);
  box-shadow: 0 24px 90px #000a;
}
.dialog::backdrop { background: #070707c9; backdrop-filter: blur(6px); }
.dialog-head, .dialog-body, .dialog-actions { padding-inline: clamp(1rem, 5vw, 1.85rem); }
.dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  padding-top: 1rem;
}
.dialog-head h2, .dialog-title, .view-title {
  font: 900 2rem/.92 var(--display);
  letter-spacing: 0;
  text-wrap: balance;
}
.dialog-body { display: grid; gap: .85rem; padding-block: .95rem 1.1rem; }
.dialog-body p { color: var(--muted); }
.dialog-actions { padding-block: 0 1.1rem; }
.dialog-body .dialog-actions { padding: 0; }
.dialog-close { margin-left: auto; }
.profile-panel, .panel {
  display: grid;
  gap: .85rem;
  min-width: 0;
  padding: clamp(.95rem, 4vw, 1.5rem);
  border: 1px solid var(--line);
  border-radius: .95rem;
  background: var(--surface);
}
.panel p, .profile-panel p { color: var(--muted); }
.panel .button-row, .profile-panel .button-row { margin-top: .2rem; }
.field {
  display: grid;
  gap: .34rem;
  min-width: 0;
  margin: 0;
  color: var(--white);
  font-size: .84rem;
  font-weight: 750;
}
.field :is(small, .hint) { color: var(--muted); font-size: .74rem; font-weight: 500; }
.input, .field :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
  width: 100%;
  min-height: 48px;
  padding: .65rem .78rem;
  border: 1px solid #555257;
  border-radius: .6rem;
  color: var(--white);
  background: #0e0e10;
  font-size: 1rem;
  font-weight: 500;
}
.field textarea { min-height: 6rem; resize: vertical; }
.input::placeholder { color: #a19c96; opacity: 1; }
input:is([type="checkbox"], [type="radio"]) { width: 1.1rem; height: 1.1rem; margin: 0 .35rem 0 0; accent-color: var(--accent); vertical-align: -.16rem; }
.chips, .tabs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .45rem;
}
.chip, .tab {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .45rem .8rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface);
  font-size: .8rem;
  font-weight: 750;
  text-decoration: none;
}
.chip:hover, .tab:hover { border-color: var(--muted); color: var(--white); }
.chip[aria-pressed="true"], .tab[aria-selected="true"], .chip.active, .tab.active {
  border-color: var(--accent);
  color: var(--white);
  background: #40221c;
}
.badge, .status {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  align-self: start;
  justify-self: start;
  width: max-content;
  max-width: 100%;
  padding: .26rem .5rem;
  border: 1px solid #59423e;
  border-radius: 999px;
  color: #ffe7de;
  background: #34201d;
  font-size: .65rem;
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: 0;
}
.list { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  min-height: 3.25rem;
  padding: .7rem .75rem;
  border: 1px solid var(--line);
  border-radius: .7rem;
  background: var(--surface);
}
.list-item > div { min-width: 0; }
.list-item p { color: var(--muted); font-size: .8rem; }
.toast {
  position: fixed;
  z-index: 10;
  right: max(.85rem, env(safe-area-inset-right));
  bottom: calc(4.7rem + env(safe-area-inset-bottom));
  left: max(.85rem, env(safe-area-inset-left));
  width: fit-content;
  max-width: min(92vw, 32rem);
  margin-inline: auto;
  padding: .65rem .9rem;
  border: 1px solid #756359;
  border-radius: .65rem;
  color: var(--white);
  background: #292321;
  box-shadow: 0 8px 24px #0008;
  font-size: .83rem;
  text-align: center;
}
.toast:empty { display: none; }
.skip-link {
  position: fixed;
  z-index: 20;
  top: .5rem;
  left: .5rem;
  transform: translateY(-180%);
  padding: .75rem;
  border-radius: .5rem;
  color: var(--bg);
  background: var(--white);
}
.skip-link:focus { transform: translateY(0); }

@media (min-width: 600px) {
  .app-shell { padding-bottom: 7rem; }
  .topbar { min-height: 5.25rem; }
  .hero { min-height: 25rem; }
  .hero-art {
    background:
      radial-gradient(ellipse at 87% 13%, #ff8661 0, #ff4d32 19%, #91251e 40%, transparent 66%),
      linear-gradient(104deg, #191010 25%, #3b1714 67%, #722822 99%);
  }
  .hero-art::after { background: linear-gradient(95deg, #170e0de5 4%, #170e0d6b 49%, transparent 76%), repeating-linear-gradient(116deg, #fce2c110 0 1px, transparent 1px 5px); }
  .hero-art > span { top: 2%; right: 1%; }
  .hero-index { top: 1.3rem; right: 1.3rem; }
  .hero-copy { font-size: 1rem; }
  .card-body, .gallery-caption { padding: .95rem; }
  .card-copy { font-size: .85rem; }
  .bottom-nav { bottom: max(.8rem, env(safe-area-inset-bottom)); border-width: 1px; border-radius: .9rem; padding: .32rem; }
  .toast { bottom: calc(5.5rem + env(safe-area-inset-bottom)); }
}
@media (min-width: 850px) {
  .hero { min-height: 30rem; }
  .hero-title { font-size: 5rem; }
  .card-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .card-art, .gallery-art { min-height: 7.5rem; }
}
@media (max-width: 355px) {
  .hero .button-row .button { flex: 1 1 7.5rem; }
  .hero-title { font-size: 2.35rem; }
  .card-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}

.brand-mark > span, .brand-label > b { color: var(--accent); }
.brand-label > b { font: inherit; }
.profile-button { color: var(--accent); }
.hero-title > span:last-child { color: #ff795f; }
.hero-art > span::before, .hero-art > span::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 75%;
  height: 1px;
  background: linear-gradient(90deg, transparent, #ffd8b986, transparent);
  transform: translate(-50%, -50%) rotate(28deg);
}
.hero-art > span::after { transform: translate(-50%, -50%) rotate(118deg); }

.page-intro {
  display: grid;
  justify-items: start;
  gap: .65rem;
  min-height: 11.2rem;
  margin-bottom: 1.25rem;
  padding: clamp(1.05rem, 5vw, 2rem);
  border: 1px solid #45312e;
  border-radius: 1rem;
  background:
    radial-gradient(ellipse at 92% 3%, #7b342c, transparent 55%),
    linear-gradient(136deg, #201513, #161415 67%);
}
.page-intro h1 {
  font: 900 2.55rem/.9 var(--display);
  letter-spacing: 0;
}
.page-intro p:not(.eyebrow) { max-width: 40rem; color: #d2c5bd; font-size: .93rem; }
.tag {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 1.45rem;
  color: var(--accent);
  font-size: .66rem;
  font-weight: 850;
  line-height: 1.15;
  letter-spacing: 0;
  text-transform: uppercase;
}
.feature-grid, .merch-grid, .board-grid, .plan-grid, .form-grid {
  display: grid;
  gap: .75rem;
}
.gallery-tabs { margin-bottom: .9rem; }
.gallery-art { aspect-ratio: 1.3; }
.gallery-caption { color: var(--muted); font-size: .78rem; }
.gallery-caption strong, .gallery-caption b, .gallery-caption h3 { color: var(--white); font-size: 1rem; }
.event-list { display: grid; gap: .65rem; }
.event-list .list-item { align-items: start; }
.social-links { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; }
.plan-option {
  position: relative;
  display: grid;
  gap: .4rem;
  min-width: 0;
  min-height: 4.2rem;
  padding: .75rem;
  border: 1px solid #4b4549;
  border-radius: .7rem;
  color: var(--white);
  background: #191719;
  text-align: left;
}
.plan-option:hover { border-color: #a49e98; }
.plan-option[aria-pressed="true"], .plan-option:has(:checked), .plan-option.is-active {
  border-color: var(--accent);
  background: #36201c;
}
.plan-option label { cursor: pointer; }
.plan-option .price, .plan-option strong { font-size: 1.12rem; line-height: 1; }
.chip.is-active { border-color: var(--accent); color: var(--white); background: #40221c; }
.dialog label:not(.field) { color: var(--muted); font-size: .83rem; }
.dialog .button-row { align-self: start; }

@media (min-width: 600px) {
  .feature-grid, .merch-grid, .board-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .plan-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.hero-index {
  position: static;
  display: inline-flex;
  gap: .35em;
  margin-bottom: .38rem;
}
.hero-index > span { color: var(--accent); }
.hero-stripe {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  display: flex;
  justify-content: space-between;
  gap: .65rem;
  width: auto;
  height: auto;
  margin: 0;
  padding: .7rem clamp(.8rem, 2.8vw, 1.5rem);
  border-bottom: 1px solid #f1c1b336;
  color: #fff1e6;
  background: #1b100e70;
  font-size: .49rem;
  font-weight: 800;
  letter-spacing: 0;
  line-height: 1;
}
.section-link { gap: .45rem; text-align: left; }
.section-link svg { width: 16px; height: 16px; }
.card-art, .gallery-art {
  width: 100%;
  padding: 0;
  border: 0;
}
.card-art:focus-visible, .gallery-art:focus-visible { outline-offset: -4px; }
.card-art-label {
  position: absolute;
  top: .65rem;
  left: .65rem;
  color: #fff1e9;
  font: 900 1rem/1 var(--display);
  letter-spacing: 0;
}
.card-play {
  display: grid;
  place-items: center;
  width: 2.6rem;
  height: 2.6rem;
  border: 1px solid #fff3e680;
  border-radius: 50%;
  background: #160e1090;
  transition: transform .2s ease, background .2s ease;
}
.card-play svg { width: 1.15rem; height: 1.15rem; }
.card-art:hover .card-play { transform: scale(1.08); background: #160e10e0; }
.card-title > button {
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  letter-spacing: 0;
  text-align: left;
  text-wrap: balance;
}
.card-title > button:hover { text-decoration: underline; text-underline-offset: .14em; }
.card-kicker > .tag { min-height: 0; margin-left: .25em; color: var(--muted); font-size: .58rem; }
.save-button {
  position: absolute;
  z-index: 2;
  top: .3rem;
  right: .3rem;
  border-color: #ffffff46;
  background: #151113c4;
}
.save-button[aria-pressed="true"] { border-color: var(--accent); color: var(--accent); }
.save-button[aria-pressed="true"] svg { fill: #ff624b47; }
.status > i {
  width: .38rem;
  height: .38rem;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 2px #ff624b30;
}
.gallery-art > span {
  font: 900 2.3rem/.9 var(--display);
  letter-spacing: 0;
  transform: rotate(-9deg);
}
.gallery-art > span > span { color: #ffe3b9; }
.gallery-studio { background: radial-gradient(ellipse at 26% 80%, #944b35, #3b2927 74%); }
.gallery-road { background: repeating-linear-gradient(135deg, #293250 0 12px, #242d49 12px 23px); }
.gallery-poster { background: radial-gradient(ellipse at 81% 25%, #c84a36, #752c21 67%); }
.gallery-cover { background: repeating-linear-gradient(153deg, #463753 0 19px, #61415c 19px 28px); }
.gallery-grid + .panel { margin-top: 1rem; }
.gallery-caption > .card-kicker { line-height: 1.4; }
.panel { justify-items: start; }
.panel h2, .panel h3 { line-height: 1.08; letter-spacing: 0; }
.list-item, .list-item p { overflow-wrap: anywhere; }
.event-list .list-item { display: flex; flex-wrap: wrap; gap: .8rem 1.3rem; }
.event-list .list-item h2 { margin: .28rem 0; }
.dialog-head { align-items: start; }
.dialog-head .eyebrow { margin-bottom: .45rem; }
.dialog-head .icon-button { margin-left: auto; }
.dialog:has(.tour-steps) .dialog-head {
  padding-top: 1.3rem;
  background: radial-gradient(ellipse at 24% 0%, #4a241e 0%, #141415 75%);
}
.tour-steps .chip { justify-content: center; min-width: 44px; }
.form-grid .check-field {
  display: flex;
  align-items: start;
  gap: .4rem;
  padding: .25rem 0;
}
.check-field input { flex: none; margin-top: .13rem; }
.plan-grid {
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
}
.plan-grid legend { margin-bottom: .45rem; padding: 0; color: var(--white); font-size: .85rem; font-weight: 750; }
.plan-option > small { font-size: .72rem; line-height: 1.28; }
.dialog-body > .gallery-art { max-height: 15rem; border-radius: .7rem; }
@media (min-width: 380px) {
  .plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 950px) {
  .view-inicio > .section:last-child .feature-grid, .view-dentro > .feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

.wallpaper-heading {
  display: grid;
  gap: .8rem;
  margin: 1.5rem 0 1rem;
}
.wallpaper-heading h2 {
  margin: .28rem 0;
  font: 900 2rem/.95 var(--display);
  letter-spacing: 0;
}
.wallpaper-heading p:not(.eyebrow), .wallpaper-caption p:not(.eyebrow) { color: var(--muted); }
.wallpaper-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.55rem, 2vw, 1rem);
}
.wallpaper-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: .8rem;
  background: var(--surface);
}
.wallpaper-preview {
  position: relative;
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: #141415;
}
.wallpaper-preview > img { display: block; width: 100%; height: auto; }
.wallpaper-expand {
  position: absolute;
  right: .45rem;
  bottom: .45rem;
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid #ffffff6e;
  border-radius: .45rem;
  color: #fff;
  background: #0c0c0de8;
}
.wallpaper-expand svg { width: 1.1rem; height: 1.1rem; }
.wallpaper-caption { display: grid; gap: .25rem; padding: clamp(.55rem, 2vw, .85rem); }
.wallpaper-caption h3 { font-size: .97rem; line-height: 1.06; letter-spacing: 0; }
.wallpaper-caption p:not(.eyebrow) { font-size: .76rem; }
.wallpaper-caption .button {
  justify-self: stretch;
  margin-top: .4rem;
  padding-inline: .5rem;
  font-size: .65rem;
  text-align: center;
}
.wallpaper-caption .button svg { flex: 0 0 auto; }
.art-invite { margin-top: 1rem; }
.art-drafts { padding-left: 1.1rem; color: var(--muted); }
.submission-preview { display: block; max-width: 100%; max-height: 12rem; border: 1px solid var(--line); border-radius: .55rem; }

.dialog[data-tone="wallpaper"][open] {
  position: fixed;
  inset: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100vw;
  max-width: none;
  height: 100dvh;
  max-height: none;
  padding-block: env(safe-area-inset-top) env(safe-area-inset-bottom);
  border: 0;
  border-radius: 0;
  background: #0c0c0d;
}
.dialog[data-tone="wallpaper"] .dialog-head { align-items: center; }
.dialog[data-tone="wallpaper"] .dialog-head h2 { font-size: 1.7rem; }
.dialog[data-tone="wallpaper"] .dialog-body { min-height: 0; }
.dialog[data-tone="wallpaper"] .dialog-actions { justify-content: center; }
.wallpaper-full {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  justify-items: center;
  gap: .5rem;
  min-height: 0;
  margin: 0;
}
.wallpaper-full img { width: 100%; height: 100%; min-height: 0; object-fit: contain; }
.wallpaper-full figcaption { color: var(--muted); font-size: .8rem; text-align: center; }

.portrait-reference img {
  display: block;
  width: 100%;
  max-height: 25rem;
  border: 1px solid var(--line);
  border-radius: .6rem;
  object-fit: cover;
  object-position: center 32%;
}
.portrait-reference p { margin-block: .35rem; }
.portrait-reference p a { text-decoration: underline; text-underline-offset: .12em; }

.board-notice {
  display: flex;
  align-items: center;
  gap: .55rem .8rem;
  margin-bottom: 1rem;
  padding: .65rem .8rem;
  border: 1px solid #734e42;
  border-radius: .6rem;
  background: #2c201d;
  color: #f0d9ce;
  font-size: .82rem;
}
.board-notice .tag { flex-shrink: 0; }
.community-layout, .community-aside { display: grid; align-items: start; gap: .75rem; }
.board-thread { gap: .75rem; }
.discussion-list { display: grid; gap: .65rem; width: 100%; margin: 0; padding: 0; list-style: none; }
.fan-comment {
  display: grid;
  grid-template-columns: 2.2rem minmax(0, 1fr);
  gap: .55rem;
  padding: .7rem .55rem;
  border: 1px solid var(--line);
  border-radius: .6rem;
  background: var(--surface-up);
}
.fan-avatar {
  display: grid;
  width: 2.15rem;
  aspect-ratio: 1;
  place-items: center;
  border: 1px solid #ffffff33;
  border-radius: 50%;
  color: #fff;
  background: #6e343a;
  font-size: .68rem;
  font-weight: 800;
}
.avatar-blue { background: #324490; }
.avatar-violet { background: #613d79; }
.avatar-gold { background: #785127; }
.fan-comment-body { min-width: 0; }
.fan-author { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .45rem; }
.fan-author span { color: var(--muted); font-size: .72rem; }
.fan-comment-body p { margin-top: .28rem; overflow-wrap: anywhere; }
.fan-tools { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem; margin-top: .4rem; }
.fan-tools .button {
  min-height: 2.4rem;
  gap: .32rem;
  padding: .35rem .45rem;
  border-color: transparent;
  background: transparent;
  color: var(--muted);
  font-size: .76rem;
}
.fan-tools .button:hover, .fan-tools .button:focus-visible { border-color: var(--muted); color: var(--white); }
.fan-tools svg { width: .85rem; height: .85rem; }
.moderator-note {
  width: 100%;
  padding: .8rem;
  border: 1px solid #6b514a;
  border-left: 3px solid var(--accent);
  border-radius: .5rem;
  background: #2b1b18;
}
.moderator-note p:not(.eyebrow) { margin-block: .4rem; color: #f0dfd5; }
.moderator-note .section-link { margin-top: .25rem; }
.report-status { color: var(--accent) !important; }
.draft-list { overflow-wrap: anywhere; }

@media (min-width: 600px) {
  .wallpaper-heading { grid-template-columns: 1fr auto; align-items: end; }
  .wallpaper-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (min-width: 800px) {
  .community-layout { grid-template-columns: minmax(0, 2fr) minmax(15rem, 1fr); }
}

.brand-reference { display: block; width: 76px; height: 48px; object-fit: contain; flex: none; }

/* ===== Iteration 2: cinematic photo grading, editorial, shop, community, demo panel ===== */
:root { --grade: grayscale(.55) contrast(1.12) brightness(.82) sepia(.18) saturate(.9); --red-wash: linear-gradient(180deg, #0c0c0d00 30%, #0c0c0de6 100%), linear-gradient(120deg, #ff624b2e, #0c0c0d00 55%); }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hero-photo .hero-art { background: #140e0c; }
.hero-photo .hero-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--grade); }
.hero-photo .hero-art::before { display: none; }
.hero-photo .hero-art::after { background: linear-gradient(180deg, #0c0c0d33 0%, #0c0c0d99 45%, #0c0c0df5 92%), linear-gradient(100deg, #ff624b33, transparent 60%); }
.hero-credit { position: absolute; right: .8rem; bottom: .55rem; font-size: .62rem; color: var(--muted); }
.media-failed { background: radial-gradient(ellipse at 70% 20%, #7d281e, #140e0c 75%) !important; min-height: 8rem; }
.card-photo { position: relative; display: block; overflow: hidden; background: #140e0c; }
.card-photo img { width: 100%; height: 100%; object-fit: cover; filter: var(--grade); transition: transform .4s ease; }
.card-photo::after { content: ""; position: absolute; inset: 0; background: var(--red-wash); pointer-events: none; }
.card-photo:hover img { transform: scale(1.04); }
.card-photo .card-art-label { position: absolute; z-index: 1; left: .7rem; top: .7rem; }
.photo { position: relative; margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 1rem; background: #140e0c; }
.photo img { width: 100%; height: 100%; object-fit: cover; filter: var(--grade); }
.photo-banner { aspect-ratio: 16 / 7; margin: .5rem 0 1.2rem; }
.photo-banner::after { content: ""; position: absolute; inset: 0; background: var(--red-wash); pointer-events: none; }
.photo-tile { aspect-ratio: 4 / 5; }
.photo-credit { font-size: .68rem; color: var(--muted); line-height: 1.35; }
.photo .photo-credit { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; padding: .5rem .7rem; background: #0c0c0dcc; }
.photo-credit a { color: var(--white); }
.photo-grid, .product-grid, .board-grid, .counter-grid, .qa-list { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 15rem), 1fr)); }
.counter-grid { grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); margin-top: 1rem; }
.counter strong { display: block; font: 800 2.4rem/1 var(--display); color: var(--accent); }
.counter span { font-size: .8rem; color: var(--muted); }
.back-link { display: inline-flex; gap: .4rem; align-items: center; min-height: 44px; color: var(--muted); text-decoration: none; font-size: .9rem; }
.back-link svg { width: 1.1rem; }
.article { max-width: 44rem; display: grid; gap: 1rem; }
.article > p { font-size: 1.05rem; line-height: 1.65; }
.byline { color: var(--muted); font-size: .85rem; }
.source-box { padding: 1rem; border-left: 3px solid var(--accent); background: var(--surface); border-radius: .5rem; display: grid; gap: .4rem; }
.article-list, .topic-list, .stages { list-style: none; margin: 0; padding: 0; display: grid; gap: .8rem; }
.article-row, .topic-row, .board-card { display: grid; gap: .35rem; text-decoration: none; }
.article-row:hover, .topic-row:hover, .board-card:hover { border-color: var(--accent); }
.article-row h2, .topic-row h3, .board-card h3 { font: 700 1.5rem/1.05 var(--display); text-transform: uppercase; }
.article-row p, .topic-row p, .board-card p { color: var(--muted); font-size: .9rem; }
.facts { display: grid; gap: .6rem; margin: 0; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); }
.facts div { padding: .7rem .8rem; border: 1px solid var(--line); border-radius: .6rem; }
.facts dt { font-size: .7rem; letter-spacing: 0; text-transform: uppercase; color: var(--muted); }
.facts dd { margin: .2rem 0 0; }
.confirm-line { display: flex; gap: .5rem; align-items: center; color: var(--white); padding: .7rem .9rem; border: 1px solid #3c6b47; background: #13221a; border-radius: .6rem; }
.confirm-line svg { width: 1.1rem; color: #7fd48f; }
.tag-demo { border-color: var(--accent) !important; color: var(--accent) !important; }
.demo-banner { display: flex; gap: .5rem; flex-wrap: wrap; align-items: center; color: var(--muted); }
.meet { display: grid; gap: .8rem; }
.campaign-ref { margin-top: 1.5rem; display: grid; gap: .6rem; }
.campaign-ref img { width: 100%; border-radius: .6rem; filter: var(--grade); pointer-events: none; user-select: none; }
.campaign-ref figcaption { font-size: .8rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.toolbar { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; margin: 1rem 0; }
.search-field { position: relative; flex: 1 1 14rem; }
.search-field svg { position: absolute; left: .75rem; top: 50%; width: 1.1rem; transform: translateY(-50%); color: var(--muted); }
.search-field .input { padding-left: 2.4rem; width: 100%; }
.product-card { border: 1px solid var(--line); border-radius: 1rem; overflow: hidden; background: var(--surface); }
.product-card > a { display: block; }
.product-art { position: relative; display: grid; place-items: center; aspect-ratio: 1; color: var(--white); background: radial-gradient(ellipse at 70% 15%, #4a1c16, #141415 70%); }
.product-art svg { width: 55%; opacity: .9; }
.product-art.tone-gris svg { color: #b9b4ab; }
.product-art.tone-negro { background: radial-gradient(ellipse at 70% 15%, #2a2a2d, #0c0c0d 70%); }
.product-note { position: absolute; left: .6rem; bottom: .5rem; font-size: .62rem; color: var(--muted); }
.product-detail { display: grid; gap: 1.5rem; }
.product-art.is-large { border-radius: 1rem; max-width: 30rem; }
@media (min-width: 800px) { .product-detail { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); align-items: start; } }
.fan-comment.is-assistant .fan-comment-body { border-left: 2px solid var(--accent); padding-left: .7rem; }
.queue-item { display: grid; gap: .6rem; }
.queue-preview, .thumb { max-width: 12rem; border-radius: .5rem; }
.thumb { width: 3rem; height: 3rem; object-fit: cover; }
.art-drafts .list-item { display: flex; gap: .7rem; align-items: center; flex-wrap: wrap; }
.qa-list h3 { font: 700 1.3rem/1.1 var(--display); text-transform: uppercase; margin: .3rem 0; }
.bottom-nav .nav-item span { font-size: .68rem; }

/* RHLM owns the entire document, including light-mode native controls and overscroll. */
html:root, html body, html body > div, html .app-shell, html .main-content, html .view { background-color: var(--bg) !important; color: var(--white); color-scheme: dark; }
html body { min-height: 100svh; }
html .article, html .product-detail, html .event-detail { background-color: var(--bg); color: var(--white); min-width: 0; }
.product-detail > *, .vendor-photo { min-width: 0; max-width: 100%; }
.product-detail { grid-template-columns: minmax(0, 1fr); }
.product-detail .facts dd { overflow-wrap: anywhere; }
@media (min-width: 800px) { .product-detail { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); } }
html .input, html input, html select, html textarea { color-scheme: dark; }
.input::placeholder { color: var(--muted); }
.app-shell *, .app-shell *::before, .app-shell *::after, .dialog * { letter-spacing: 0; }
h1, h2, h3, .card-title { font-family: var(--display); font-weight: 900; }
:root { --grade: grayscale(.3) contrast(1.04) brightness(1) saturate(.8); --red-wash: linear-gradient(180deg, transparent 85%, var(--bg) 100%); --scrim: linear-gradient(180deg, transparent 26%, var(--bg) 68%); }
.hero.hero-photo { min-height: 0; aspect-ratio: auto; padding-top: 240px; border-radius: 8px; background: var(--bg); }
.hero-photo .hero-art { bottom: auto; height: 300px; background: var(--bg); }
.hero-photo .hero-art img { object-fit: contain; object-position: center top !important; }
.hero-photo .hero-art::after { background: linear-gradient(180deg, transparent 70%, var(--bg) 100%); }
.hero-photo .hero-content { padding: 1rem 1rem 2.5rem; }
.hero-title { font-size: 3.5rem; }
.hero-credit { bottom: .6rem; left: 1rem; right: 1rem; }
.card-photo { aspect-ratio: 3 / 4; }
.card-photo::before { display: none; }
.card-photo img { object-fit: contain; }
.card-photo[href="#de-gira"] img { object-fit: cover; }
.card-photo:hover img { transform: none; }
.card-photo::after { display: none; }
.card-photo .card-art-label { top: auto; bottom: .6rem; background: var(--bg); padding: .25rem; }
.photo-banner { aspect-ratio: 3 / 4; max-width: 30rem; }
.photo-banner img, .photo-tile img { object-fit: contain; }
.photo-banner::after { display: none; }
.home-destinations { display: grid; gap: 1rem; }
.destination-art { display: block; aspect-ratio: 3 / 4; background: var(--surface); }
.destination-art img { width: 100%; height: 100%; object-fit: contain; }
.vendor-photo { margin: 0; }
.vendor-photo img { width: 100%; height: 100%; object-fit: contain; }
.vendor-photo .product-note { position: static; padding: .6rem; background: var(--surface); }
.bottom-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.page-intro { min-height: 0; border: 0; border-radius: 0; padding: 1.25rem 0; background: var(--bg); }
.page-intro h1 { font-size: 3rem; }
.page-intro p:not(.eyebrow), .hero-copy { color: var(--muted); }
.editorial-card, .wallpaper-card, .product-card, .photo, .panel { border-radius: 8px; }
.community-featured { display: grid; gap: 1.5rem; }
.community-preview { min-width: 0; border-top: 1px solid var(--line); padding-top: 1rem; }
.community-preview h2 { font-size: 1.7rem; margin: .5rem 0 .75rem; }
.community-preview .fan-comment { border: 0; background: var(--bg); padding-inline: 0; }
.community-preview .fan-tools { display: none; }
.assistant-panel { margin: 1.5rem 0; padding: 1.25rem 0; border-block: 1px solid var(--line); display: grid; gap: .85rem; }
#assistant-answer { display: grid; gap: .65rem; }
.original-collection { margin: 1rem 0 2rem; }
.original-collection h2 { font-size: 2.3rem; margin: .4rem 0 1rem; }
.original-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.original-poster { border-color: var(--accent); }
.original-poster .wallpaper-caption { border-top: 2px solid var(--accent); }
.original-poster .wallpaper-preview { aspect-ratio: 768 / 1365; }
.original-poster img { width: 100%; height: 100%; object-fit: contain; }
.recap-media { display: grid; gap: .8rem; }
.recap-lead, .recap-shot { aspect-ratio: 16 / 10; }
.recap-lead img, .recap-shot img { object-fit: contain; }
.recap-gallery { display: grid; gap: .8rem; }
.facts { grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.section-link { white-space: normal; }
.board-notice { flex-wrap: wrap; }
@media (max-width: 599px) { .card-grid { grid-template-columns: 1fr; } .card-photo { max-height: 450px; } .original-grid { gap: .6rem; } .original-poster .button { font-size: .75rem; } }
@media (min-width: 600px) { .home-destinations, .community-featured, .recap-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hero.hero-photo { padding-top: 350px; } .hero-photo .hero-art { height: 410px; } .hero-title { font-size: 4.5rem; } }
@media (min-width: 850px) { .hero.hero-photo { padding-top: 400px; } .hero-photo .hero-art { height: 470px; } .hero-title { font-size: 5rem; } }

/* ===== Revisión privada: revista musical / arte callejero ===== */
:root { --bg: #0c0b0d; --white: #f6f0e6; --accent: #ed342c; --bone: #f6f0e6; --ink-shadow: 0 2px 0 rgba(0,0,0,.55), 0 10px 28px rgba(0,0,0,.6);
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --tear: polygon(0 0,100% 0,100% 94%,96% 97%,91% 93%,85% 98%,78% 94%,70% 99%,62% 95%,55% 98%,47% 94%,39% 99%,31% 95%,23% 98%,15% 94%,8% 98%,0 95%); }
html, body { background: var(--bg) !important; color: var(--bone) !important; color-scheme: dark; overflow-x: hidden; }
body::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 60; background: var(--grain); opacity: .06; mix-blend-mode: overlay; }
.ink { font-family: var(--display); font-weight: 900; text-transform: uppercase; letter-spacing: 0; line-height: .86; text-shadow: var(--ink-shadow);
  -webkit-mask-image: var(--grain), linear-gradient(#000,#000); -webkit-mask-composite: source-over; }
.section-title.ink { font-size: 3rem; }
.page-intro { padding: 2.2rem 0 1.4rem; display: grid; gap: .7rem; }
.page-intro .hero-copy { color: var(--muted); max-width: 32ch; }
.hero-title.ink { font-size: 3.4rem; }
.hero-title.ink > span:last-child { color: var(--accent); }
.hero .button-row .button { flex: 0 0 auto; }

/* tap & motion */
a, button, summary { min-height: 44px; }
.tile, .work, .product-card, .fa-piece, .recap-shot, .event-link, .topic-row, .story-row, .forum-tab, .album, .button { transition: transform .18s ease, filter .18s ease, box-shadow .18s ease; }
.tile:active, .work:active, .product-card:active, .fa-piece:active, .recap-shot:active, .event-link:active, .topic-row:active, .story-row:active, .button:active { transform: translateY(2px) scale(.985); filter: brightness(1.25); }
@media (hover: hover) { .tile:hover, .work:hover, .product-card:hover, .fa-piece:hover, .recap-shot:hover { transform: translateY(-3px); filter: brightness(1.12); } }
.dialog[open] { animation: rv-pop .22s ease-out; }
@keyframes rv-pop { from { opacity: 0; transform: translateY(14px) scale(.97); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* Home mosaic */
.mosaic { display: grid; gap: .7rem; margin-top: 1.4rem; }
.tile-pair { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.tile-pair-offset { grid-template-columns: 1.25fr .75fr; }
.tile { position: relative; display: block; overflow: hidden; text-decoration: none; background: #18151a; isolation: isolate; }
.tile img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.72) contrast(1.08); }
.tile-wide { aspect-ratio: 2 / 1; }
.tile-square { aspect-ratio: 1; }
.tile-pair-offset .tile-square { aspect-ratio: auto; min-height: 11rem; }
.tile::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(180deg, transparent 40%, rgba(12,11,13,.88)); }
.tile-title { position: absolute; z-index: 2; left: .9rem; right: .9rem; bottom: .8rem; display: flex; align-items: end; justify-content: space-between; gap: .5rem; font: 900 1.7rem/.86 var(--display); text-transform: uppercase; text-shadow: var(--ink-shadow); }
.tile-square .tile-title { font-size: 1.3rem; }
.tile-arrow svg { width: 1.2rem; height: 1.2rem; opacity: .75; }
.tile-wide.tile-fx-humo .tile-title { left: 1.1rem; right: auto; }
.tile-fx-humo::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(60% 80% at 15% 70%, rgba(237,52,44,.32), transparent 70%); mix-blend-mode: screen; }
.tile-fx-flash::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(30% 30% at 80% 15%, rgba(255,255,255,.35), transparent 70%); }
.tile-fx-papel { clip-path: var(--tear); }
.tile-fx-halftone::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(circle, rgba(237,52,44,.55) 1.2px, transparent 1.6px) 0 0 / 7px 7px; -webkit-mask-image: linear-gradient(90deg, #000 0 18%, transparent 45%); mask-image: linear-gradient(90deg, #000 0 18%, transparent 45%); }
.tile-fx-cinta::before { content: ""; position: absolute; z-index: 3; top: .6rem; left: -1.2rem; width: 5.5rem; height: 1.3rem; background: rgba(246,240,230,.78); transform: rotate(-24deg); }
.tile-shop { background: var(--bone); }
.tile-shop img { object-fit: contain; filter: none; padding: .6rem; mix-blend-mode: multiply; }
.tile-shop::after { background: linear-gradient(90deg, rgba(12,11,13,.9), transparent 55%); }
.mosaic-credit { margin-top: .8rem; color: var(--muted); font-size: .72rem; }
.social-strip { display: flex; flex-wrap: wrap; gap: .5rem; }
.media-failed { background: repeating-linear-gradient(135deg, #1a1719 0 12px, #141214 12px 24px); min-height: 8rem; }

/* editorial lists */
.split-hero, .cover-hero { position: relative; margin: 0 calc(var(--space) * -1) 1.2rem; }
.split-hero .photo, .cover-hero .photo { margin: 0; border-radius: 0; }
.split-hero img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.cover-hero img { width: 100%; aspect-ratio: 16/10; object-fit: cover; }
.split-hero .section-title, .cover-hero .section-title { position: absolute; left: var(--space); bottom: 2.2rem; }
.editorial-list { list-style: none; padding: 0; display: grid; gap: 0; }
.story-row { display: grid; gap: .3rem; padding: 1.3rem 0; border-top: 3px solid var(--accent); text-decoration: none; }
.story-row h2 { font: 900 1.6rem/.92 var(--display); text-transform: uppercase; }
.story-date { color: var(--accent); font-size: .78rem; font-weight: 700; letter-spacing: 0; text-transform: uppercase; }

/* La Libreta */
.works { list-style: none; padding: 0; display: grid; gap: 1rem; }
.works li:nth-child(even) { margin-left: 8%; } .works li:nth-child(odd) { margin-right: 8%; }
.work { position: relative; display: block; text-decoration: none; }
.work-art { position: relative; display: block; aspect-ratio: 16/9; overflow: hidden; background: #18151a; }
.work-art img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.8) contrast(1.06); }
.work-art img.is-cover { filter: blur(0); object-fit: cover; object-position: 50% 30%; }
.work-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(12,11,13,.85), transparent 60%); }
.work-title { position: absolute; z-index: 2; left: .9rem; bottom: .7rem; right: .9rem; font-size: 2rem; }
.fx-papel { clip-path: var(--tear); }
.fx-humo::before { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(70% 60% at 80% 20%, rgba(237,52,44,.3), transparent 70%); mix-blend-mode: screen; }
.work-meta { display: inline-flex; align-items: center; gap: .4rem; min-height: 44px; color: var(--accent); font-weight: 700; text-transform: uppercase; letter-spacing: 0; font-size: .8rem; }
.work.is-soon .work-meta { color: var(--muted); }
.work-chapter .work-art { margin: 0 calc(var(--space) * -1) 1rem; }

/* Discografía */
.albums { list-style: none; padding: 0; display: grid; gap: 2.4rem; }
.album { display: grid; grid-template-columns: 42% 1fr; gap: 1rem; align-items: end; }
.album.is-flip { grid-template-columns: 1fr 42%; } .album.is-flip .album-cover { order: 2; }
.album-cover { width: 100%; aspect-ratio: 1; object-fit: cover; box-shadow: 10px 10px 0 var(--accent); }
.album.is-flip .album-cover { box-shadow: -10px 10px 0 var(--accent); }
.album-copy { display: grid; gap: .5rem; } .album-copy h2 { font-size: 1.8rem; }
.album-copy p:not(.eyebrow) { color: var(--muted); font-size: .9rem; }
.status-pill { display: inline-flex; align-items: center; min-height: 44px; padding: 0 .9rem; color: var(--muted); border: 1px dashed var(--muted); font-size: .8rem; }
@media (max-width: 380px) { .album, .album.is-flip { grid-template-columns: 1fr; } .album.is-flip .album-cover { order: 0; } }

/* Gira */
.event-list { display: grid; gap: 0; }
.event-row { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding: 1rem 0; border-top: 1px solid rgba(246,240,230,.14); background: none !important; border-radius: 0 !important; }
.event-link { display: grid; gap: .15rem; text-decoration: none; flex: 1; }
.event-date { font-size: 1.5rem; color: var(--accent); }
.event-city { font-weight: 700; } .event-venue { color: var(--muted); font-size: .85rem; }
.tour-note { margin: 1.6rem 0; padding: 1.2rem 1.2rem 1.2rem 1.4rem; background: linear-gradient(100deg, rgba(237,52,44,.16), transparent); border-left: 6px solid var(--accent); display: grid; gap: .5rem; }
.tour-note h3 { font: 900 1.6rem/.95 var(--display); text-transform: uppercase; }
.data-line { color: var(--muted); font-size: .85rem; letter-spacing: 0; text-transform: uppercase; margin: .6rem 0 1.4rem; }
.stages { list-style: none; padding: 0; display: grid; gap: 1.2rem; }
.stage-label { font-size: 2.2rem; color: var(--accent); }
.campaign-ref { margin: 2rem 0 0; } .campaign-ref figcaption { color: var(--muted); font-size: .75rem; margin-top: .5rem; }
.recap-cover { position: relative; margin: 0 calc(var(--space) * -1); min-height: 70svh; display: flex; align-items: end; padding: var(--space); overflow: hidden; }
.recap-cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 30% 40%; filter: saturate(.6) contrast(1.15) brightness(.75); }
.recap-cover > div { position: relative; z-index: 3; }
.smoke { position: absolute; inset: 0; z-index: 1; background: radial-gradient(80% 50% at 30% 100%, rgba(246,240,230,.18), transparent 70%), linear-gradient(0deg, var(--bg), transparent 55%); }
.flashes { position: absolute; inset: 0; z-index: 2; background: radial-gradient(6% 6% at 78% 22%, rgba(255,255,255,.7), transparent), radial-gradient(4% 4% at 22% 30%, rgba(255,255,255,.5), transparent); animation: rv-flash 4s infinite; }
@keyframes rv-flash { 0%, 100% { opacity: .2; } 8% { opacity: 1; } 12% { opacity: .2; } 60% { opacity: .5; } }
.recap-act { display: grid; gap: .8rem; margin: 2rem 0; }
.recap-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: .6rem; }
.recap-shot { position: relative; padding: 0; border: 0; background: none; overflow: hidden; text-align: left; }
.recap-shot img { width: 100%; height: 100%; aspect-ratio: 4/3; object-fit: cover; filter: saturate(.7); }
.shot-tall img { aspect-ratio: 3/4; } .shot-ref img { aspect-ratio: 16/9; }
.shot-cap { position: absolute; left: .5rem; right: .5rem; bottom: .4rem; font-size: .68rem; text-shadow: 0 1px 4px #000; }
.clip-card { padding: 1.1rem; background: #17141a; display: grid; gap: .6rem; justify-items: start; border-left: 4px solid var(--accent); }
.clip-card.is-preview { border-left-style: dashed; color: var(--muted); }

/* Tienda */
.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem .8rem; }
.product-card { display: grid; gap: .3rem; text-decoration: none; background: none !important; border: 0 !important; }
.product-card:nth-child(3n+1) { grid-column: span 2; }
.product-art { aspect-ratio: 1; background: var(--bone); display: grid; place-items: center; overflow: hidden; margin: 0; }
.product-card:nth-child(3n+1) .product-art { aspect-ratio: 2/1; }
.product-art img { width: 100%; height: 100%; object-fit: contain; padding: .5rem; }
.product-art.is-text { background: #1a161b; color: var(--bone); text-align: center; padding: 1rem; gap: .4rem; align-content: center; }
.product-art.is-text .ink { font-size: 1.4rem; }
.product-art.is-text small { color: var(--muted); font-size: .72rem; }
.product-detail .product-art { aspect-ratio: 1; max-width: 32rem; }
.product-card .card-title { font: 900 1.25rem/.95 var(--display); text-transform: uppercase; }
.shop-more { margin-top: 1.4rem; }

/* Comunidad */
.forum-menu { position: sticky; top: 0; z-index: 5; display: flex; gap: .3rem; overflow-x: auto; padding: .5rem 0; margin-bottom: 1rem; background: var(--bg); scrollbar-width: none; }
.forum-tab { display: inline-flex; align-items: center; padding: 0 1rem; font: 900 1.25rem/1 var(--display); text-transform: uppercase; text-decoration: none; color: var(--muted); white-space: nowrap; }
.forum-tab.is-active { color: var(--bg); background: var(--accent); }
.qa-list { list-style: none; padding: 0; display: grid; gap: 0; }
.qa { border-top: 1px solid rgba(246,240,230,.14); padding: .3rem 0; }
.qa summary { display: flex; align-items: center; cursor: pointer; list-style: none; font-weight: 700; padding: .5rem 0; }
.qa summary::after { content: "+"; margin-left: auto; color: var(--accent); font: 900 1.6rem var(--display); }
.qa[open] summary::after { content: "–"; }
.qa p { color: var(--muted); padding-bottom: .5rem; } .qa .byline { color: var(--accent); font-size: .75rem; }
.community-featured { display: grid; gap: 1.2rem; margin: 1.6rem 0; }
.community-preview, .thread { padding: 1rem 0; border-top: 3px solid var(--accent); background: none !important; border-radius: 0 !important; }
.community-preview h2, .thread h3 { font: 900 1.6rem/.95 var(--display); text-transform: uppercase; margin: .3rem 0 .6rem; }
.threads { list-style: none; padding: 0; display: grid; gap: 1rem; }
.topic-row { display: block; text-decoration: none; padding: .7rem 0; border: 0 !important; background: none !important; }
.topic-row h3 { font: 900 1.35rem/1 var(--display); text-transform: uppercase; } .topic-row p { color: var(--muted); font-size: .8rem; }
.topic-list { list-style: none; padding: 0; }
.assistant-panel { margin-top: 2.4rem; padding: 1.4rem; background: linear-gradient(140deg, #2a0f0e, #141215 60%); display: grid; gap: .8rem; border: 0 !important; }
.assistant-panel h2 { font-size: 2.4rem; }
.ask-form { margin-top: 1.4rem; }
.empty { color: var(--muted); padding: 1rem 0; }

/* Galería: fan art collection */
.fanart-collection { margin: 2.6rem 0; display: grid; gap: 1rem; }
.fanart-collection > h2 { font-size: 2.4rem; }
.concepts { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
.concept { aspect-ratio: 4/5; }
.fa-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .55rem; grid-auto-flow: dense; }
.fa-piece { position: relative; overflow: hidden; padding: 0; border: 0; background: #17141a; text-align: left; grid-column: span 3; aspect-ratio: 4/5; isolation: isolate; }
.fa-shape-0 { grid-column: span 6; aspect-ratio: 16/9; } .fa-shape-1 { grid-column: span 3; } .fa-shape-2 { grid-column: span 3; aspect-ratio: 3/4; }
.fa-shape-3 { grid-column: span 4; aspect-ratio: 1; } .fa-shape-4 { grid-column: span 2; aspect-ratio: auto; }
.fa-media { position: absolute; inset: 0; display: block; }
.fa-media img { width: 100%; height: 100%; object-fit: cover; }
.fa-title { position: absolute; z-index: 4; left: .6rem; right: .6rem; bottom: .5rem; font-size: 1.1rem; }
.fa-pending { display: grid; place-content: center; text-align: center; gap: .4rem; padding: 1rem; background: repeating-linear-gradient(-45deg, #17141a 0 10px, #1d181c 10px 20px); border: 1px dashed rgba(246,240,230,.3); }
.fa-pending .fa-title { position: static; font: 900 1.2rem/.95 var(--display); text-transform: uppercase; color: var(--muted); }
.concept.fa-pending .fa-title { font-size: 1.6rem; color: var(--bone); }
.fa-pending small { color: var(--muted); font-size: .68rem; }
.fx-serigrafia img { filter: grayscale(1) contrast(1.9) brightness(1.05); mix-blend-mode: luminosity; } .fx-serigrafia { background: var(--accent); }
.fx-serigrafia .fa-media::after { content: ""; position: absolute; inset: 0; background: var(--accent); mix-blend-mode: multiply; transform: translate(5px, 4px); opacity: .55; }
.fx-tinta img { filter: grayscale(1) contrast(1.4); } .fx-tinta .fa-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(115deg, transparent 50%, rgba(237,52,44,.85) 50.5% 58%, transparent 58.5%); mix-blend-mode: multiply; }
.fx-halftone img { filter: grayscale(.6) contrast(1.2); } .fx-halftone .fa-media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(circle, #0c0b0d 1.4px, transparent 1.9px) 0 0 / 6px 6px; -webkit-mask-image: radial-gradient(closest-side, transparent 55%, #000); mask-image: radial-gradient(closest-side, transparent 55%, #000); }
.fx-papel { clip-path: var(--tear); } .fx-papel img { filter: sepia(.35) saturate(.7); } .fx-papel .fa-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(246,240,230,.0) 70%, rgba(246,240,230,.9) 70.5%); }
.fx-fotocopia img { filter: grayscale(1) contrast(2.4) brightness(1.15); } .fx-fotocopia .fa-media::after { content: ""; position: absolute; inset: 0; background: var(--grain); opacity: .5; mix-blend-mode: multiply; }
.fx-luz-roja img { filter: grayscale(1) contrast(1.1); } .fx-luz-roja .fa-media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(200deg, rgba(237,52,44,.85), rgba(12,11,13,.6)); mix-blend-mode: hard-light; }
.fx-gel img { filter: saturate(.4); } .fx-gel .fa-media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(80% 70% at 70% 10%, rgba(237,52,44,.7), transparent 60%), radial-gradient(60% 60% at 10% 90%, rgba(60,40,140,.55), transparent 70%); mix-blend-mode: screen; }
.fx-humo img { filter: saturate(.5) brightness(.85); } .fx-humo .fa-media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(90% 40% at 50% 100%, rgba(246,240,230,.35), transparent 70%); }
.fx-cinta::before, .fx-cinta::after { content: ""; position: absolute; z-index: 5; width: 4.5rem; height: 1.1rem; background: rgba(246,240,230,.75); }
.fx-cinta::before { top: .4rem; left: -1rem; transform: rotate(-30deg); } .fx-cinta::after { top: .4rem; right: -1rem; transform: rotate(30deg); }
.fx-cinta img { filter: saturate(.75) contrast(1.05); }
.fx-flash img { filter: contrast(1.25) brightness(1.08) saturate(.6); } .fx-flash .fa-media::after { content: ""; position: absolute; inset: 0; background: radial-gradient(25% 25% at 85% 12%, rgba(255,255,255,.9), transparent 70%), linear-gradient(0deg, rgba(12,11,13,.7), transparent 50%); }
.fa-piece.is-full { position: relative; display: block; aspect-ratio: auto; } .fa-piece.is-full .fa-media { position: relative; } .fa-piece.is-full img { max-height: 70svh; object-fit: contain; }
.wallpaper-full img { user-select: none; -webkit-user-drag: none; }
.art-invite { margin-top: 2.4rem; padding: 1.4rem 0; border-top: 3px solid var(--accent); display: grid; gap: .8rem; justify-items: start; background: none !important; }
.art-invite h2 { font-size: 2rem; }
@media (min-width: 850px) {
  .mosaic { grid-template-columns: repeat(2, 1fr); } .mosaic > .tile-wide:first-child { grid-column: span 2; aspect-ratio: 2.6/1; }
  .fa-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .fa-shape-0 { grid-column: span 6; } .fa-shape-1, .fa-shape-2, .fa-shape-4 { grid-column: span 3; } .fa-shape-3 { grid-column: span 4; }
  .product-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .split-hero, .cover-hero { margin-inline: 0; }
}
.main-content:focus { outline: none; }
.hero.hero-photo { border: 0 !important; background: none !important; border-radius: 0 !important; }
.original-poster, .wallpaper-card { border: 0 !important; border-radius: 0 !important; background: none !important; }
.work-meta svg, .event-row .button svg { width: 1rem; height: 1rem; }

/* De Gira tablet: mic photo face on the left, title kept off the face on the right. */
.tile-wide.tile-title-right .tile-title { left: auto; right: 1.1rem; text-align: right; }
.concept-poster { margin: 0; display: grid; gap: .35rem; aspect-ratio: auto; }
.concept-poster img { width: 100%; aspect-ratio: 764 / 1024; object-fit: cover; display: block; -webkit-user-drag: none; pointer-events: none; }
.concept-poster figcaption { color: var(--muted); font-size: .66rem; }

/* Private pilot (shared community) */
.pilot-entry { display: grid; gap: .25rem; margin: 0 0 1rem; padding: 1rem; border: 1px solid var(--accent); border-radius: 4px; color: var(--bone); text-decoration: none; background: rgba(237,52,44,.08); }
.pilot-entry small { color: var(--muted); }
.pilot { display: grid; gap: .8rem; }
.pilot-head { display: flex; justify-content: space-between; align-items: center; gap: .5rem; flex-wrap: wrap; }
.pilot-badge { display: inline-block; padding: .1rem .4rem; border: 1px solid var(--muted); border-radius: 3px; font-size: .68rem; color: var(--muted); text-transform: uppercase; }
.pilot-verdict { display: block; font-size: .72rem; color: var(--muted); }
.pilot-verdict.pilot-riesgo { color: var(--accent); }
.pilot-notice { color: var(--bone); border-left: 3px solid var(--accent); padding-left: .6rem; }
.pilot-item { display: grid; gap: .4rem; padding: .8rem 0; border-top: 1px solid rgba(246,240,230,.15); overflow-wrap: anywhere; }
.pilot-art { max-width: 100%; max-height: 320px; object-fit: contain; pointer-events: none; }
.pilot-post p { overflow-wrap: anywhere; }
.pilot-list { margin: .5rem 0 0; padding-left: 1rem; }
.text-button { background: none; border: 0; color: var(--muted); text-decoration: underline; cursor: pointer; padding: 0; font: inherit; font-size: .8rem; }

.ta-answer { display: grid; gap: .6rem; }
.ta-list { margin: 0; padding-left: 1.2rem; display: grid; gap: .35rem; max-height: 26rem; overflow: auto; font-size: .9rem; }
.ta-list a, .ta-cite a { color: var(--bone); text-decoration: underline; text-underline-offset: 2px; }
.ta-cite { color: var(--muted); font-size: .8rem; }
.ta-label, .ta-ai-label { color: var(--accent); font-weight: 700; text-transform: uppercase; letter-spacing: 0; font-size: .8rem; }
.ta-foot, .ta-more { color: var(--muted); font-size: .78rem; }
.ta-ai { border-left: 2px solid var(--accent); padding-left: .7rem; }
.pilot-ai { color: var(--accent); font-size: .75rem; font-weight: 700; letter-spacing: 0; text-transform: uppercase; }

/* Integrated editorial revision: one image/title composition and open page hierarchy. */
:root { --hero-fade: linear-gradient(0deg, var(--bg) 0%, transparent 58%), linear-gradient(90deg, var(--bg), transparent 18%, transparent 82%, var(--bg)); }
.hero.hero-photo { margin-inline: calc(-1 * var(--space)); padding: 0; min-height: 590px; height: min(78svh, 760px); max-height: none; align-items: end; }
.hero-photo .hero-art { inset: 0; height: 100%; background: transparent; }
.hero-photo .hero-art img { object-fit: cover; object-position: 45% 20% !important; filter: saturate(.8) contrast(1.03); }
.hero-photo .hero-art::after { background: var(--hero-fade); }
.hero-photo .hero-content { padding: 0 var(--space) 24px; max-width: none; }
.hero-title.ink { font-size: 64px; line-height: 1.02; letter-spacing: 0; margin: 0 0 8px; }
.hero-title span { display: block; }
.hero-copy { margin-top: 8px; }
.hero .button-row { margin-top: 12px; }
.view-inicio .mosaic { margin-top: 12px; }
.tile-shop img { object-fit: cover; object-position: 50% 35%; padding: 0; }
.tile-shop::after { background: linear-gradient(0deg, var(--bg), transparent 70%); }
:root { --catalogue-background: #151416; --catalogue-border: #676267; }
.platform-link { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 48px; text-decoration: none; background: transparent; }
.platform-link > img { width: 28px; height: 28px; object-fit: contain; filter: brightness(0) invert(1); }
.social-strip .platform-link { width: 56px; }
.social-spotify > img { width: 30px; height: 30px; filter: none; }
.catalogue-controls { display: flex; flex-wrap: nowrap; gap: 8px; min-width: 0; margin-top: 4px; align-items: start; }
.catalogue-link { display: flex; flex-direction: column; align-items: center; justify-content: start; gap: 4px; flex: 0 1 62px; width: 62px; min-width: 44px; min-height: 44px; padding: 0; color: var(--white); text-decoration: none; }
.catalogue-capsule { display: grid; place-items: center; width: 100%; height: 32px; flex: none; border: 1px solid var(--catalogue-border); border-radius: 16px; background: var(--catalogue-background); }
.catalogue-capsule > img { width: 21px; height: 21px; object-fit: contain; }
.catalogue-label { font-size: 11px; line-height: 16px; text-align: center; white-space: nowrap; }
.catalogue-link:focus-visible, .platform-link:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.album-copy { min-width: 0; }
.bottom-nav { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.ink, .hero-title, .section-title, .work-title, .event-date, .stage-label { line-height: 1.05; letter-spacing: 0; -webkit-mask-image: none; mask-image: none; }
.section-title.ink { font-size: 48px; overflow-wrap: anywhere; }
.section-title, .page-intro h1 { line-height: 1.08; }
.tile-title { line-height: 1.05; font-size: 32px; }
.tile-square .tile-title { font-size: 26px; }
.work-title { font-size: 36px; bottom: 16px; }
.work-art { min-width: 0; }
.work-chapter .work-art { margin-inline: 0; clip-path: none; }
.chapter-title { font-size: 40px; line-height: 1.1; }
.work-chapter h2 { font-size: 28px; line-height: 1.15; margin-top: 18px; }
.work-chapter p { line-height: 1.8; }
.work-chapter .source-box { border: 0; padding: 12px 0; background: none; font-size: 12px; }
.work-chapter .source-box a { font-size: 12px; }
.story-cta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: 12px; }
.inside-lead { display: grid; gap: 24px; margin-top: 12px; }
.inside-photo { border: 0; border-radius: 0; aspect-ratio: 4 / 3; }
.inside-lead h2, .inside-notes h2 { font-size: 40px; line-height: 1.08; }
.inside-lead p { margin-top: 12px; }
.inside-notes { display: grid; gap: 12px; padding-block: 36px; scroll-margin-top: 20px; }
.inside-formats { display: grid; gap: 24px; }
.inside-formats h3 { font-size: 28px; }
.inside-photo .photo-credit, .view-inicio .hero-credit, .view-inicio .mosaic-credit, .view-galeria .mosaic-credit, .view-galeria .concept figcaption, .view-galeria .photo-credit, .view-galeria .fanart-collection > .eyebrow { display: none; }
.community-intro { padding-top: 20px; padding-bottom: 12px; }
.assistant-panel, .ta-panel { margin: 0 0 24px; padding: 0; background: none; border: 0; }
.ta-panel h2 { font-size: 40px; line-height: 1.1; }
.question-chips { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.question-chips .button { border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: none; padding-inline: 0; font-size: 13px; text-align: left; }
.fan-forums { padding-top: 36px; margin-top: 24px; border-top: 3px solid var(--accent); }
.fan-forums > h2 { font-size: 36px; line-height: 1.1; margin: 8px 0 20px; }
.forum-index { display: grid; gap: 24px; margin-block: 24px; }
.forum-index-link { display: grid; grid-template-columns: 1fr 24px; gap: 8px; text-decoration: none; }
.forum-index-link h3 { font-size: 28px; }
.forum-index-link span { color: var(--muted); grid-row: 2; font-size: 14px; }
.forum-index-link svg { width: 20px; grid-column: 2; grid-row: 1; }
.forum-menu { position: static; flex-wrap: wrap; overflow: visible; gap: 4px 16px; }
.forum-tab { padding-inline: 0; white-space: normal; font-size: 22px; background: none !important; }
.forum-tab.is-active { color: var(--accent); }
.pilot h2, .topic-row h3, .thread h3, .story-row h2, .board-thread h1 { line-height: 1.15; overflow-wrap: anywhere; }
.story-row { width: 100%; background: none; color: var(--white); border: 0; border-top: 1px solid var(--line); text-align: left; font: 900 26px/1.2 var(--display); }
.qa summary { gap: 12px; }
.qa summary::after { flex-shrink: 0; }
.board-thread { border: 0; padding: 0; background: none; }
.gallery-tablist { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 24px; border-bottom: 1px solid var(--line); }
.gallery-tab { flex: 1; border: 0; background: none; padding: 12px 0; color: var(--muted); font: 900 24px/1.1 var(--display); }
.gallery-tab.is-active { color: var(--white); border-bottom: 3px solid var(--accent); }
.original-grid { gap: 24px 12px; }
.original-poster .wallpaper-preview { aspect-ratio: 768 / 1664; }
.original-poster .wallpaper-caption { border: 0; padding-inline: 0; }
.original-poster .wallpaper-caption > .eyebrow { display: none; }
.original-poster h3 { font-size: 26px; line-height: 1.15; }
.original-poster .button { font-size: 12px; padding-inline: 0; background: none; border: 0; text-align: left; }
.portrait-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.portrait { padding: 0; border: 0; background: var(--surface); aspect-ratio: 3 / 4; overflow: hidden; }
.portrait img { width: 100%; height: 100%; object-fit: cover; }
.archive-wallpapers { margin-top: 32px; }
.archive-wallpapers summary { color: var(--muted); cursor: pointer; padding-block: 12px; }
.art-invite { border: 0; padding: 24px 0; }
.art-invite h2 { font-size: 36px; line-height: 1.12; }
.contextual-login { max-width: 480px; padding-block: 20px; }
.contextual-login h2 { font-size: 36px; }
@media (max-width: 380px) { .hero-title.ink { font-size: 58px; } .hero.hero-photo { min-height: 560px; } .tile-square .tile-title { font-size: 24px; } }
@media (min-width: 600px) { .hero-title.ink { font-size: 88px; } .section-title.ink { font-size: 64px; } .hero.hero-photo { min-height: 640px; } .inside-lead { grid-template-columns: 1fr 1fr; align-items: center; } .inside-formats, .forum-index { grid-template-columns: repeat(3, minmax(0, 1fr)); } .original-grid, .portrait-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .hero.hero-photo { margin-inline: 0; height: 760px; min-height: 0; } .hero-photo .hero-art img { object-position: 45% 0% !important; } .hero-photo .hero-content { padding-inline: 48px; } .hero-title.ink { font-size: 104px; } .hero-content { max-width: 850px; } .portrait-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); } }

/* RHLM display: exact condensed 900 face with separated glyphs in every cascade. */
html body .app-shell :is(h1,h2,h3,h4,.ink,.tile-title,.work-title,.forum-tab,.gallery-tab,.brand-mark,.section-title), html body .dialog :is(h1,h2,h3,.ink) { letter-spacing: 0; -webkit-text-stroke: 0; text-shadow: none; -webkit-mask-image: none; mask-image: none; font-weight: 900; }
html body .app-shell :is(h1,h2,h3,h4,.ink,.tile-title,.work-title,.forum-tab,.gallery-tab) { font-family: var(--display); }
.tile-lock { position: absolute; z-index: 3; top: 12px; right: 12px; color: var(--bone); background: var(--bg); padding: 7px; border-radius: 50%; }
.tile-lock svg, .access-mark svg { width: 18px; height: 18px; }
.access-mark { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
.member-preview-gate { display: grid; gap: 16px; padding-block: 28px; }
.member-preview-gate h2 { font-size: 32px; line-height: 1.12; }
.member-preview-gate .button { justify-self: start; }
.inside-discovery { display: grid; grid-template-columns: 1fr 100px; align-items: center; gap: 16px; margin: 20px 0 28px; }
.inside-heading h2 { font-size: 34px; line-height: 1.1; margin-bottom: 12px; }
.inside-discovery .inside-photo { aspect-ratio: 3/4; margin: 0; }
.inside-photo img { width: 100%; height: 100%; object-fit: cover; }
.benefit-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 26px 12px; }
.benefit { min-width: 0; }
.benefit-cover { display: block; position: relative; width: 100%; aspect-ratio: 1; padding: 0; border: 0; overflow: hidden; background: var(--accent-dark); color: var(--bone); }
.benefit-cover img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.65); }
.benefit-cover::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(0deg,var(--accent-dark),transparent 70%),var(--grain); opacity: .45; }
.benefit h3 { font: 900 26px/1.12 var(--display); margin-top: 12px; min-height: 2.24em; }
.benefit p { font-size: 13px; line-height: 1.5; color: var(--muted); }
.benefit-symbol { position: absolute; z-index: 2; bottom: 14px; right: 14px; width: 40px; height: 40px; display: grid; place-items: center; background: var(--bg); border-radius: 50%; }
.benefit-symbol svg { width: 22px; height: 22px; }
.mini-label { position: absolute; top: 8px; left: 8px; z-index: 2; background: var(--bg); padding: 4px 6px; font-size: 10px; }
.benefit-voice .benefit-cover { background: linear-gradient(135deg,var(--accent-dark),var(--bg)); }
.voice-wave { position: absolute; inset: 25% 10%; display: flex; align-items: center; justify-content: center; gap: 4px; }
.voice-wave i { width: 5px; height: 22%; background: var(--accent); border-radius: 4px; animation: voice-pulse 2.4s ease-in-out infinite alternate; }
.voice-wave i:nth-child(3n) { height: 75%; animation-delay: -.7s; }
.voice-wave i:nth-child(3n + 1) { height: 45%; animation-delay: -1.4s; }
.benefit-book .benefit-cover::before { content: ''; position: absolute; z-index: 2; inset: 12px auto 12px 8px; width: 4px; background: var(--bone); opacity: .6; }
.inside-cta { margin-top: 32px; }
.sample-art-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.sample-art-grid figure { margin: 0; min-width: 0; }
.sample-art-grid img { width: 100%; aspect-ratio: 3/4; object-fit: contain; }
.sample-art-grid figcaption { padding-block: 12px; }
.sample-art-grid h2 { font-size: 26px; line-height: 1.12; }
.sample-art-grid p { font-size: 12px; color: var(--muted); }
.drop-motion { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; overflow: hidden; }
.drop-motion figure { margin: 0; animation: drop-reveal 4s ease-in-out infinite alternate; }
.drop-motion figure:nth-child(2) { animation-delay: -2s; }
.drop-motion img { width: 100%; aspect-ratio: 3/4; object-fit: contain; }
.drop-motion figcaption { font: 900 24px/1.2 var(--display); padding-block: 12px; }
.sample-stamp { position: absolute; top: 12px; left: 12px; background: var(--bg); padding: 6px; font-size: 12px; }
@keyframes voice-pulse { to { transform: scaleY(.5); } }
@keyframes drop-reveal { from { transform: translateY(4px); opacity: .7; } to { transform: translateY(0); opacity: 1; } }
@media (min-width:600px) { .inside-discovery { grid-template-columns: minmax(0,1fr) 180px; gap: 32px; } .inside-heading h2 { font-size: 48px; } .benefit-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 20px; } .benefit h3 { font-size: 30px; } .benefit p { font-size: 14px; } }
@media (prefers-reduced-motion:reduce) { .voice-wave i,.drop-motion figure { animation: none; } }

/* Session-only Dentro demonstration; existing editorial art and display face. */
.tile-member-copy { display: block; margin-top: 6px; font: 500 12px/1.4 var(--sans); text-transform: none; }
.upgrade-page { max-width: 620px; display: grid; gap: 20px; margin: 24px auto; }
.upgrade-page .page-intro { margin: 0; padding: 0; }
.upgrade-page .button { width: 100%; min-height: 48px; }
.demo-status { color: var(--accent); border-block: 1px solid var(--line); padding-block: 16px; font-weight: 700; }
.payment-methods { min-width: 0; margin: 0; padding: 0; border: 0; display: grid; gap: 8px; }
.payment-methods legend { margin-bottom: 12px; color: var(--muted); }
.payment-option { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 12px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface); cursor: pointer; }
.payment-option:has(input:checked) { border-color: var(--accent); }
.payment-option input { accent-color: var(--accent); width: 20px; height: 20px; }
.profile-inside { display: grid; gap: 12px; padding-top: 20px; margin-top: 20px; border-top: 1px solid var(--line); }
.voice-sample { position: relative; min-height: 160px; background: var(--surface); }
#demo-profile-form, #demo-reply-form, #demo-topic-form { min-width: 0; }
.dialog-body p, .upgrade-page p, .pilot-post p { overflow-wrap: anywhere; }

/* Five-step editorial journey; reuses existing RHLM photography and products. */
.home-tour-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 12px; max-width: 430px; }
.home-tour-actions .button { width: 100%; min-width: 0; min-height: 44px; padding: 8px 10px; border-radius: 4px; font-size: 12px; white-space: normal; }
.home-tour-actions .button svg { flex: none; width: 15px; height: 15px; }
.home-tour-actions .button-secondary { border-color: var(--line); background: color-mix(in srgb,var(--bg) 88%,transparent); }
.dialog[data-tone="journey"] { width: min(calc(100% - 16px),54rem); max-height: min(92dvh,52rem); border-color: var(--line); border-radius: 6px; background: var(--bg); }
.dialog[data-tone="journey"]::backdrop { background: color-mix(in srgb,var(--bg) 88%,transparent); }
.dialog[data-tone="journey"] .dialog-head { padding: 12px 16px 0; background: none; }
.dialog[data-tone="journey"] .dialog-head .eyebrow { margin: 0; }
.dialog[data-tone="journey"] .dialog-body { display: grid; gap: 18px; padding: 12px 16px 18px; }
.dialog[data-tone="journey"] .dialog-actions { display: grid; gap: 12px; position: sticky; z-index: 4; bottom: 0; padding: 12px 16px max(16px,env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: var(--bg); }
.journey-visual { position: relative; isolation: isolate; width: 100%; aspect-ratio: 1 / .94; max-height: 38dvh; min-height: 190px; overflow: hidden; background: var(--surface); clip-path: var(--tear); animation: journey-enter .32s ease-out both; }
.journey-visual::after { content: ''; position: absolute; z-index: 4; inset: 0; pointer-events: none; background: var(--grain); opacity: .12; }
.journey-visual img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.7) contrast(1.08); }
.journey-copy { display: grid; align-content: center; gap: 10px; min-width: 0; animation: journey-copy-enter .34s ease-out both; }
.journey-copy .eyebrow { margin: 0; }
.journey-copy h2 { margin: 0; font-size: clamp(38px,12vw,58px); line-height: 1.02; }
.journey-copy > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }
.journey-copy strong { color: var(--bone); }
.journey-links { display: flex; flex-wrap: wrap; gap: 4px 16px; }
.journey-links a { display: inline-flex; align-items: center; gap: 5px; min-height: 44px; color: var(--bone); font-size: 12px; font-weight: 700; text-underline-offset: 4px; }
.journey-links svg { width: 14px; height: 14px; color: var(--accent); }
.journey-membership { padding-top: 10px; border-top: 1px solid var(--line); color: var(--accent) !important; font-weight: 750; }
.journey-progress { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--muted); font-size: 12px; }
.journey-bars { display: flex; align-items: end; gap: 5px; height: 20px; }
.journey-bars i { display: block; width: 22px; height: 5px; background: var(--line); transition: height .2s ease,background .2s ease; }
.journey-bars i:nth-child(2),.journey-bars i:nth-child(4) { height: 9px; }
.journey-bars i.is-past { background: var(--muted); }
.journey-bars i.is-active { height: 18px; background: var(--accent); }
.journey-controls { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.journey-controls .button { width: 100%; min-width: 0; padding-inline: 8px; border-radius: 4px; font-size: 12px; }
.journey-controls [data-action="previous"] { grid-column: 1 / -1; justify-self: start; width: auto; border: 0; background: transparent; color: var(--muted); padding-inline: 0; }
.journey-music { background: linear-gradient(145deg,var(--surface),var(--bg)); }
.journey-music > img { position: absolute; z-index: 2; right: 7%; bottom: 7%; width: 58%; height: 72%; object-fit: cover; transform: rotate(3deg); }
.journey-vinyl { position: absolute; top: 5%; left: -8%; width: 76%; aspect-ratio: 1; border-radius: 50%; background: repeating-radial-gradient(circle,var(--surface) 0 3px,var(--bg) 4px 7px); animation: journey-spin 16s linear infinite; }
.journey-vinyl::before { content: ''; position: absolute; inset: 35%; border-radius: 50%; background: var(--accent); }
.journey-vinyl i { position: absolute; inset: 46%; border-radius: 50%; background: var(--bone); }
.journey-needle { position: absolute; z-index: 3; top: 5%; left: 54%; width: 3px; height: 46%; background: var(--bone); transform: rotate(-24deg); transform-origin: top; opacity: .7; }
.journey-stage > img { object-position: 50% 22%; }
.journey-beam { position: absolute; z-index: 2; inset: -30% 10% 10%; background: linear-gradient(105deg,transparent 30%,color-mix(in srgb,var(--bone) 24%,transparent) 48%,transparent 63%); transform: translateX(-40%); animation: journey-beam 4.8s ease-in-out infinite alternate; }
.journey-map-pulse { position: absolute; z-index: 3; right: 12%; bottom: 13%; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; color: var(--bone); background: var(--accent); animation: journey-pulse 2.4s ease-in-out infinite; }
.journey-map-pulse svg { width: 24px; height: 24px; }
.journey-community { display: grid; place-items: center; background: radial-gradient(circle at 50% 45%,var(--accent-dark),var(--bg) 70%); }
.journey-orbit { position: absolute; z-index: 2; display: grid; place-items: center; width: 60px; height: 60px; border: 1px solid var(--line); border-radius: 50%; color: var(--bone); background: var(--surface); animation: journey-float 3.6s ease-in-out infinite alternate; }
.journey-orbit svg { width: 27px; height: 27px; }
.orbit-one { top: 15%; left: 15%; }
.orbit-two { top: 20%; right: 12%; animation-delay: -.8s; }
.orbit-three { right: 23%; bottom: 12%; animation-delay: -1.6s; }
.journey-signal,.journey-inside-wave { display: flex; align-items: center; justify-content: center; gap: 6px; }
.journey-signal { position: absolute; left: 12%; bottom: 16%; height: 70px; }
.journey-signal i,.journey-inside-wave i { width: 4px; height: 30%; background: var(--accent); animation: journey-wave 1.8s ease-in-out infinite alternate; }
.journey-signal i:nth-child(3n),.journey-inside-wave i:nth-child(3n) { height: 90%; animation-delay: -.6s; }
.journey-signal i:nth-child(2n),.journey-inside-wave i:nth-child(2n) { height: 55%; animation-delay: -1.1s; }
.journey-collage { display: grid; grid-template-columns: 1.1fr .9fr; grid-template-rows: 1fr 1fr; gap: 7px; padding: 7px; background: var(--accent-dark); }
.journey-collage img { min-width: 0; min-height: 0; animation: journey-collage 3.8s ease-in-out infinite alternate; }
.journey-collage img:first-child { grid-row: 1 / 3; object-position: 45% 15%; }
.journey-collage img:nth-child(2) { object-position: 50% 15%; animation-delay: -.8s; }
.journey-collage img:last-child { object-fit: contain; background: var(--bone); animation-delay: -1.6s; }
.journey-inside > img { object-position: 50% 12%; opacity: .7; }
.journey-inside-lock { position: absolute; z-index: 3; top: 14%; left: 12%; display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid var(--line); border-radius: 50%; color: var(--bone); background: var(--bg); }
.journey-inside-lock svg { width: 23px; height: 23px; }
.journey-inside-wave { position: absolute; z-index: 3; right: 9%; bottom: 12%; left: 9%; height: 64px; padding: 12px; background: color-mix(in srgb,var(--bg) 84%,transparent); }
@keyframes journey-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes journey-copy-enter { from { opacity: 0; transform: translateX(8px); } to { opacity: 1; transform: none; } }
@keyframes journey-spin { to { transform: rotate(360deg); } }
@keyframes journey-beam { to { transform: translateX(45%); } }
@keyframes journey-pulse { 50% { transform: scale(1.08); opacity: .82; } }
@keyframes journey-float { to { transform: translateY(9px) rotate(3deg); } }
@keyframes journey-wave { to { transform: scaleY(.45); } }
@keyframes journey-collage { to { transform: translateY(-5px); } }
@media (min-width:700px) {
  .dialog[data-tone="journey"] .dialog-body { grid-template-columns: minmax(0,1.05fr) minmax(0,1fr); align-items: center; gap: 28px; padding: 16px 28px 24px; }
  .dialog[data-tone="journey"] .dialog-head,.dialog[data-tone="journey"] .dialog-actions { padding-inline: 28px; }
  .journey-visual { max-height: 50dvh; aspect-ratio: 1 / 1.08; }
  .journey-copy h2 { font-size: 56px; }
  .journey-controls { grid-template-columns: auto minmax(150px,1fr) minmax(140px,1fr); align-items: center; }
  .journey-controls:not(:has([data-action="previous"])) { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .journey-controls [data-action="previous"] { grid-column: auto; }
}
@media (max-width:340px) {
  .home-tour-actions { gap: 6px; }
  .home-tour-actions .button { padding-inline: 6px; font-size: 11px; }
  .dialog[data-tone="journey"] .dialog-body { gap: 12px; }
  .journey-visual { min-height: 178px; }
  .journey-copy h2 { font-size: 38px; }
  .journey-controls .button { font-size: 11px; }
}
@media (max-height:700px) {
  .dialog[data-tone="journey"] { max-height: 96dvh; }
  .journey-visual { min-height: 170px; max-height: 31dvh; }
  .journey-copy h2 { font-size: 38px; }
}
@media (prefers-reduced-motion:reduce) {
  .journey-visual,.journey-copy,.journey-vinyl,.journey-beam,.journey-map-pulse,.journey-orbit,.journey-signal i,.journey-inside-wave i,.journey-collage img { animation: none !important; }
}

/* ---------- Portada: logo manuscrito ---------- */
.hero-logo-title { max-width: none; margin: .2rem 0 .55rem; }
.hero-logo { display: block; width: 76%; max-width: 440px; height: auto; }
@media (max-width: 600px) { .hero-logo { max-width: 258px; } }
.hero-copy.hero-tagline { max-width: 21rem; color: #f6ece2; font: 900 1.3rem/1.08 var(--display); letter-spacing: .01em; text-transform: uppercase; text-wrap: balance; }
@media (min-width: 600px) { .hero-copy.hero-tagline { font-size: 1.55rem; } }

/* ---------- Microinteracciones unificadas ---------- */
@keyframes rhlm-view-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes rhlm-rise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes rhlm-confirm { 0% { box-shadow: 0 0 0 0 #ff624b66; } 100% { box-shadow: 0 0 0 14px #ff624b00; } }
@media (prefers-reduced-motion: no-preference) {
  .view-enter { animation: rhlm-view-in .24s ease-out both; }
  .view-enter .hero-content > *, .view-enter .page-intro > * { animation: rhlm-rise .3s ease-out both; }
  .view-enter .hero-content > *:nth-child(2), .view-enter .page-intro > *:nth-child(2) { animation-delay: .05s; }
  .view-enter .hero-content > *:nth-child(3), .view-enter .page-intro > *:nth-child(3) { animation-delay: .1s; }
  .view-enter .mosaic > *, .view-enter .section:first-of-type, .view-enter .upgrade-page > fieldset { animation: rhlm-rise .3s ease-out .08s both; }
  .view-enter .upgrade-page > .demo-status { animation: rhlm-confirm .6s ease-out .15s both; border-radius: 4px; }
  .button, .chip, .tab, .payment-option, .plan-option, .nav-item, .tile { transition: transform .16s ease, box-shadow .2s ease, border-color .2s ease, background-color .2s ease, color .2s ease, filter .2s ease; }
  .button:hover { transform: translateY(-1px); }
  .button-primary:hover, .button-primary:focus-visible { box-shadow: 0 0 0 1px var(--accent), 0 8px 20px -10px var(--accent); }
  .tile img, .work img, .product-card img, .recap-shot img { transition: transform .32s ease, filter .2s ease; }
  .tile:hover img, .tile:focus-visible img { transform: scale(1.03); }
  .payment-option:has(input:checked), .plan-option:has(:checked) { background: #ff624b14; box-shadow: 0 0 0 1px var(--accent); }
  .chip[aria-pressed="true"], .tab[aria-selected="true"] { box-shadow: inset 0 0 0 1px var(--accent); }
}

/* Inicio: hero fits between header and fixed dock at first glance; extreme heights scroll normally. */
.hero.hero-photo { --hero-header: 84px; --hero-dock: 92px; height: calc(100svh - var(--hero-header) - var(--hero-dock)); min-height: 440px; max-height: 760px; }
@media (max-width: 599px) { .hero.hero-photo { --hero-header: 75px; --hero-dock: 80px; min-height: 420px; } }
@media (min-width: 1000px) { .hero.hero-photo { height: calc(100svh - var(--hero-header) - var(--hero-dock)); min-height: 440px; } }
@media (max-height: 700px) { .hero-logo { max-width: min(440px, calc((100svh - 300px) * 1.59)); } }
@media (min-width: 1000px) and (max-height: 820px) { .hero-logo { max-width: 380px; } }