/* AztroTech spatial direction: depth from geometry, not an animated sea. */
body[data-page="home"],
body[data-page="diagnostico-ia"] { background: #fff; }

body[data-page="home"] main#contenido,
body[data-page="diagnostico-ia"] main#contenido { background: #fff; }

/* One gently moving perspective plane gives the opening a sense of place. */
body[data-page="home"] .world-chapter {
  isolation: isolate;
  background:
    radial-gradient(ellipse 47% 57% at 76% 48%, rgba(197, 221, 250, .26), transparent 82%),
    linear-gradient(110deg, #fff 18%, #f8fbff 71%, #fff 100%);
}
body[data-page="home"] .world-chapter::before,
body[data-page="diagnostico-ia"] .page-hero::before {
  content: "";
  position: absolute;
  inset: -30% -20%;
  z-index: 0;
  background-image:
    repeating-linear-gradient(90deg, transparent 0 69px, rgba(59, 111, 178, .13) 70px 71px),
    repeating-linear-gradient(0deg, transparent 0 69px, rgba(59, 111, 178, .13) 70px 71px);
  background-size: 71px 71px;
  transform: perspective(960px) rotateX(58deg) scale(1.2) translate3d(0, 8%, 0);
  transform-origin: 50% 66%;
  mask-image: radial-gradient(ellipse 58% 48% at 50% 74%, #000 12%, transparent 85%);
  -webkit-mask-image: radial-gradient(ellipse 58% 48% at 50% 74%, #000 12%, transparent 85%);
  pointer-events: none;
  animation: aztro-grid-drift 16s ease-in-out infinite alternate;
}
body[data-page="home"] .world-chapter::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  z-index: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #86a9d3 58%, transparent);
  opacity: .55;
  pointer-events: none;
}
body[data-page="home"] .world-sticky.hero {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  align-items: center;
  gap: clamp(24px, 3.5vw, 66px);
  min-height: clamp(680px, 90svh, 880px);
  padding-top: calc(var(--hero-header-height) + 42px);
  padding-bottom: clamp(55px, 7vw, 100px);
}
body[data-page="home"] .hero-copy {
  align-items: flex-start;
  justify-content: center;
  width: 100%;
  min-height: 0;
  padding: 0;
  text-align: left;
}
body[data-page="home"] .world-sticky.hero .eyebrow { order: 1; margin-bottom: 24px; }
body[data-page="home"] .world-sticky.hero h1 {
  order: 2;
  max-width: 740px;
  margin: 0 0 25px;
  font-size: clamp(3.4rem, 4.55vw, 5.1rem);
  text-wrap: balance;
}
body[data-page="home"] .hero-lead {
  order: 3;
  max-width: 600px;
}
body[data-page="home"] .hero-actions {
  order: 4;
  justify-content: flex-start;
  margin-top: 30px;
}
body[data-page="home"] .hero-foot {
  order: 5;
  width: 100%;
  margin-top: clamp(36px, 5vw, 66px);
  text-align: left;
}
body[data-page="home"] .world-visual.hero-art {
  position: relative;
  top: auto;
  right: auto;
  width: min(100%, 490px);
  height: clamp(410px, 35vw, 500px);
  min-height: 0;
  margin: 0 auto;
  filter: drop-shadow(0 22px 32px rgba(27, 74, 130, .1));
}
body[data-page="home"] .hero-index { display: none; }
body[data-page="home"] .hero-index span {
  display: block;
  padding: 10px 0 9px 16px;
  border-left: 1px solid #6f9ccc;
  border-bottom: 1px solid rgba(90, 136, 191, .24);
  background: linear-gradient(90deg, rgba(255,255,255,.78), rgba(255,255,255,.18));
  color: #315985;
  font-size: .58rem;
  font-weight: 750;
  letter-spacing: .17em;
  text-transform: uppercase;
}
body[data-page="home"] .hero-index span:nth-child(2) { margin-left: 16px; }
body[data-page="home"] .hero-index span:nth-child(3) { margin-left: 32px; }
body[data-page="home"] .proof-band { background: #fff; }
body[data-page="home"] .proof-inner { position: relative; }
body[data-page="home"] .proof-inner::before {
  content: "";
  position: absolute;
  top: -3px;
  left: 0;
  width: 92px;
  height: 3px;
  background: #37679e;
}

/* The rest of the page keeps generous white space and measured technical detail. */
body[data-page="home"] .experience-field { background: #fff; }
body[data-page="home"] .experience-field > .section-tint { background: rgba(237, 245, 255, .32); }
body[data-page="home"] .experience-field > .ecosystem-section { background: rgba(228, 240, 255, .36); }
body[data-page="home"] .experience-field > .section-dark {
  background: rgba(229, 240, 254, .35);
  color: #0b1a33;
}
body[data-page="home"] .experience-field > .section-dark p { color: #53657c; }
body[data-page="home"] .experience-field > .section-dark .eyebrow,
body[data-page="home"] .experience-field > .section-dark h2 em,
body[data-page="home"] .experience-field > .section-dark .light-link { color: #315f99; }
body[data-page="home"] .experience-field > .section-dark .agent-grid article {
  border-color: #d5e2f1;
  background: rgba(255,255,255,.4);
}
body[data-page="home"] .experience-field > .section-dark .agent-grid article:hover {
  border-color: #8eb2d9;
  background: rgba(255,255,255,.55);
}
body[data-page="home"] .experience-field > .section-dark .agent-grid article span { color: #4771a4; }
body[data-page="home"] .experience-field > .section-dark .light-link:hover { color: #173c6c; }
body[data-page="home"] .experience-field > .closing-section {
  background: rgba(235,245,255,.2);
  border-color: #d3e1f0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
body[data-page="home"] .level-card,
body[data-page="home"] .service-card,
body[data-page="home"] .value-grid article { border-color: #d5e2f0; }
body[data-page="home"] .level-card:nth-child(even),
body[data-page="home"] .service-card:nth-child(2) { background: rgba(236,245,255,.48); }
body[data-page="home"] .experience-field :is(.level-card,.service-card,.case-card,.value-grid article) {
  background: rgba(255,255,255,.38);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
body[data-page="home"] .experience-field :is(.level-card,.service-card,.case-card,.value-grid article):hover {
  background: rgba(255,255,255,.54);
}
body[data-page="home"] .experience-field .system-diagram {
  background: rgba(248,251,255,.4);
}
body[data-page="home"] .experience-field .diagram-areas span {
  background: rgba(255,255,255,.43);
}
body[data-page="home"] .experience-field .diagram-foundation {
  background: rgba(215,232,252,.55);
}
body[data-page="home"] .experience-field .agent-grid {
  background: rgba(99,139,187,.18);
  border-color: rgba(99,139,187,.25);
}
body[data-page="home"] .experience-field .tag-list span {
  background: rgba(255,255,255,.4);
}
body[data-page="home"] .experience-field .case-body {
  background: rgba(255,255,255,.38);
}
body[data-page="home"] .level-card .card-index,
body[data-page="home"] .service-card .card-index { position: relative; padding-left: 19px; }
body[data-page="home"] .level-card .card-index::before,
body[data-page="home"] .service-card .card-index::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 7px;
  height: 7px;
  border: 1px solid #416fa5;
  transform: translateY(-50%) rotate(45deg);
}

/* The diagnostic receives the same perspective language, without a second animation canvas. */
body[data-page="diagnostico-ia"] main#contenido { isolation: isolate; }
body[data-page="diagnostico-ia"] .page-hero {
  isolation: isolate;
  background: linear-gradient(120deg, #fff 20%, #f7faff 100%);
}
body[data-page="diagnostico-ia"] .page-hero::before {
  inset: -75% -25% -100%;
  opacity: .7;
  mask-image: radial-gradient(ellipse 47% 36% at 80% 57%, #000 14%, transparent 90%);
  -webkit-mask-image: radial-gradient(ellipse 47% 36% at 80% 57%, #000 14%, transparent 90%);
}
body[data-page="diagnostico-ia"] .page-hero > .container { position: relative; z-index: 1; }
body[data-page="diagnostico-ia"] .page-hero::after { opacity: .4; }
body[data-page="diagnostico-ia"] .diagnostic-section { background: #fff; }
body[data-page="diagnostico-ia"] .diagnostic-workspace {
  background: #fff;
  box-shadow: 0 22px 55px rgba(29, 70, 118, .07);
}

@keyframes aztro-grid-drift {
  from { transform: perspective(960px) rotateX(58deg) scale(1.2) translate3d(0, 8%, 0); opacity: .72; }
  to { transform: perspective(960px) rotateX(58deg) scale(1.2) translate3d(18px, 12%, 0); opacity: 1; }
}

@media (max-width: 1100px) {
  body[data-page="home"] .world-sticky.hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
    gap: 14px;
  }
  body[data-page="home"] .world-sticky.hero h1 { font-size: clamp(3rem, 4.7vw, 4.4rem); }
  body[data-page="home"] .world-visual.hero-art { width: min(100%, 450px); height: clamp(390px, 43vw, 470px); }
}
@media (max-width: 820px) {
  body[data-page="home"] .world-sticky.hero {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-height: 0;
    padding-top: calc(var(--hero-header-height) + 48px);
    padding-bottom: 44px;
  }
  body[data-page="home"] .hero-copy {
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    text-align: left;
  }
  body[data-page="home"] .world-sticky.hero h1 { font-size: clamp(3.4rem, 8.1vw, 5.3rem); }
  body[data-page="home"] .hero-actions { justify-content: flex-start; }
  body[data-page="home"] .hero-foot {
    position: static;
    width: 100%;
    margin-top: 30px;
  }
  body[data-page="home"] .world-chapter::before {
    inset: 23% -45% -18%;
    mask-image: radial-gradient(ellipse 55% 38% at 50% 72%, #000 10%, transparent 90%);
    -webkit-mask-image: radial-gradient(ellipse 55% 38% at 50% 72%, #000 10%, transparent 90%);
    opacity: .5;
  }
  body[data-page="home"] .world-visual.hero-art {
    top: auto;
    right: auto;
    width: min(76vw, 460px);
    height: min(76vw, 460px);
    min-height: 0;
    margin: 4px auto 0;
    filter: drop-shadow(0 18px 25px rgba(27,74,130,.1));
  }
}
@media (max-width: 600px) {
  body[data-page="home"] .world-sticky.hero h1 { font-size: clamp(2.8rem, 10vw, 4.4rem); }
  body[data-page="home"] .world-visual.hero-art { width: min(88vw, 370px); height: min(88vw, 370px); }
  body[data-page="home"] .world-chapter::before { opacity: .32; }
  body[data-page="diagnostico-ia"] .page-hero::before { opacity: .38; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] .world-chapter::before,
  body[data-page="diagnostico-ia"] .page-hero::before { animation: none; }
}
