/* Interiores de marketing. La portada mantiene su propio relato y motor. */
body:not([data-interior-ready]) [data-interior-orb-anchor] {
  background: url('/zairi-orb.png') center / contain no-repeat;
}
body.zairi-interior {
  --interior-ink: #111113;
  --interior-paper: #f5f5f7;
  --interior-muted: #6e6e73;
  --interior-blue: #0A36F7;
  --interior-blue-soft: #EDF1FF;
  --interior-blue-light: #ADBCFC;
  font-optical-sizing: auto;
}
.zairi-interior .qz {
  font-family: 'Qurova', serif !important;
  font-weight: 500;
}
.zairi-interior [data-interior-orb-anchor] {
  position: relative;
  flex-shrink: 0;
  pointer-events: none;
}
.zairi-interior .zi-orb-viewport {
  position: fixed;
  inset: 0;
  z-index: 5;
  overflow: hidden;
  pointer-events: none;
  contain: strict;
}
.zairi-interior .zi-orb {
  position: absolute;
  top: 0;
  left: 0;
  width: var(--zi-orb-size, 360px);
  height: var(--zi-orb-size, 360px);
  transform-origin: 0 0;
  opacity: 0;
  will-change: transform;
  pointer-events: none;
}
.zairi-interior .zi-orb img,
.zairi-interior .zi-orb canvas {
  position: absolute;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  max-width: none;
  object-fit: contain;
  pointer-events: none;
}
/* Filtros de #orbe copiados de index.html, sin alterar el material WebGL. */
.zairi-interior .zi-orb canvas {
  opacity: 0;
  filter: drop-shadow(0 0 18px rgba(46,91,255,.34));
  transition: filter var(--mudanza) ease;
}
.zairi-interior .zi-orb[data-orb-tone="dark"] canvas {
  filter: drop-shadow(0 0 34px rgba(46,91,255,.65)) drop-shadow(0 0 110px rgba(46,91,255,.4));
}
@media (max-width:720px) {
  .zairi-interior .zi-orb canvas,
  .zairi-interior .zi-orb[data-orb-tone="dark"] canvas { filter: none !important; transition: none; }
}
.zairi-interior .zi-orb[data-ready] canvas { opacity: 1; }
.zairi-interior .zi-orb[data-ready] img { visibility: hidden; }
.zairi-interior .labs-barra {
  --tono-noche: 0;
  position: sticky;
  top: 0;
  z-index: 30;
  color: #111113;
  background: rgba(255, 255, 255, .88);
  border-bottom: 0;
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  backdrop-filter: blur(20px) saturate(150%);
  transition: color 180ms ease, background-color 180ms ease;
}
.zairi-interior .labs-barra[data-interior-tone="dark"] {
  --tono-noche: 1;
  background: rgba(17, 17, 19, .88);
  color: #f5f5f7;
}
.zairi-interior .labs-barra .labs-marca img { object-fit: contain; }
.zairi-interior .labs-menu nav {
  background: rgba(255, 255, 255, .98);
  color: #111113;
}
.zairi-interior .labs-barra[data-interior-tone="dark"] .labs-menu nav {
  background: rgba(28, 28, 30, .98);
  color: #f5f5f7;
}
.zairi-interior :is(.labs-boton, .boton, [data-interior-button]):not(.labs-acceso) {
  --interior-button-bg: #111113;
  --interior-button-fg: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .7em;
  min-height: 44px;
  border: 0;
  border-radius: 999px;
  background: var(--interior-button-bg);
  color: var(--interior-button-fg);
  font-weight: 500;
  text-decoration: none;
  touch-action: manipulation;
  transition: transform 160ms var(--sal, cubic-bezier(.23, 1, .32, 1)), opacity 160ms ease;
}
.zairi-interior [data-interior-tone="dark"] :is(.labs-boton, .boton, [data-interior-button]):not(.labs-acceso) {
  --interior-button-bg: #f5f5f7;
  --interior-button-fg: #111113;
}
.zairi-interior [data-interior-tone="light"] :is(.labs-boton, .boton, [data-interior-button]):not(.labs-acceso) {
  --interior-button-bg: #111113;
  --interior-button-fg: #fff;
}
.zairi-interior :is(.labs-boton, .boton, [data-interior-button]):active {
  transform: scale(.97);
}
.zairi-interior :is(a, button, summary, input, select, textarea):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 5px;
}
/* Mismo material, dimensiones y borde vivo del acceso de la landing. */
.zairi-interior .labs-barra .labs-acceso {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .45em;
  min-height: 44px;
  padding: 11px 20px;
  border-radius: 999px;
  white-space: nowrap;
  font-size: 15px;
  font-weight: 400;
  letter-spacing: -.01em;
  text-decoration: none;
  color: color-mix(in oklab, #fff calc(var(--tono-noche, 0) * 100%), #05070f);
  background: rgba(255,255,255,calc(.62 - .53 * var(--tono-noche, 0)));
  border: 1px solid rgba(255,255,255,calc(.20 * var(--tono-noche, 0)));
  box-shadow: inset 0 1px rgba(255,255,255,calc(.72 - .64 * var(--tono-noche, 0))), 0 12px 32px -26px rgba(6,18,64,.65);
  -webkit-backdrop-filter: blur(16px) saturate(150%);
  backdrop-filter: blur(16px) saturate(150%);
  transition: transform 140ms var(--sal, cubic-bezier(.23,1,.32,1));
}
@property --interior-giro { syntax: '<angle>'; initial-value: 0deg; inherits: false; }
.zairi-interior .labs-barra .labs-acceso::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: conic-gradient(from var(--interior-giro), transparent 0deg, rgba(92,121,250,.7) 48deg, #fff 76deg, rgba(173,188,252,.8) 104deg, transparent 190deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
  animation: interior-giro 4.5s linear infinite;
  pointer-events: none;
}
.zairi-interior .labs-barra .labs-acceso::after {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  border: 1px solid rgba(6,18,64,.14);
  opacity: calc(1 - var(--tono-noche, 0));
}
@keyframes interior-giro { to { --interior-giro: 360deg; } }
@media (hover: hover) and (pointer: fine) {
  .zairi-interior :is(.labs-boton, .boton, [data-interior-button]):not(.labs-acceso):hover { opacity: .82; }
  .zairi-interior .labs-barra .labs-acceso:hover {
    background: rgba(255,255,255,calc(.82 - .68 * var(--tono-noche, 0)));
    border-color: rgba(173,188,252,calc(.52 * var(--tono-noche, 0)));
  }
  .zairi-interior .labs-barra__seccion:hover { color: inherit; opacity: .65; }
}
@media (max-width: 650px) {
  .zairi-interior .labs-barra .labs-acceso { font-size: 12px; padding: 10px 14px; }
  .zairi-interior .labs-acceso .boton__flecha { display: none; }
}
@media (prefers-reduced-transparency: reduce) {
  .zairi-interior .labs-barra,
  .zairi-interior .labs-barra .labs-acceso { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .zairi-interior .labs-barra[data-interior-tone="dark"],
  .zairi-interior .labs-barra[data-interior-tone="dark"] .labs-acceso { background: #1c1c1e; }
}
@media (prefers-contrast: more) {
  .zairi-interior .labs-barra { background: #fff; }
  .zairi-interior .labs-barra[data-interior-tone="dark"] { background: #111113; }
  .zairi-interior .labs-barra .labs-acceso { border: 2px solid currentColor; }
}
@media (prefers-reduced-motion: reduce) {
  .zairi-interior .zi-orb { will-change: auto; }
  .zairi-interior .labs-acceso::before { animation: none !important; }
  .zairi-interior :is(.labs-boton, .boton, [data-interior-button]) { transition: opacity 160ms ease; }
  .zairi-interior :is(.labs-boton, .boton, [data-interior-button]):active { transform: none; }
  .zairi-interior [data-interior-shine] { opacity: 1 !important; }
}

/* El grafito organiza la interfaz; el azul sigue identificando la marca. */
.zairi-interior ::selection { background: #0A36F7; color: #fff; }
.zairi-interior :is(a, button, summary, input, select, textarea):focus-visible { outline-color: #0A36F7; }
.zairi-interior [data-interior-tone="dark"] :is(a, button, summary, input, select, textarea):focus-visible { outline-color: #ADBCFC; }
