:root {
  --ink:#122b25;
  --night:#070f21;
  --accent:#40dfff;
  --muted:#597269;
  --paper:#f6f7f3;
  --line:#cdd8d9;
  --gutter:clamp(24px,5.2vw,88px);
  font-family:'General Sans',Arial,sans-serif;
  color:var(--ink);
  background:var(--paper);
  font-synthesis:none;
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
* {
  box-sizing:border-box
}
body {
  margin:0
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  font:inherit
}
a {
  color:inherit;
  text-decoration:none
}
button {
  cursor:pointer
}
button:disabled {
  cursor:default
}
[hidden] {
  display:none!important
}
a:focus-visible,button:focus-visible,[tabindex]:focus-visible {
  outline:3px solid #17647b;
  outline-offset:6px
}
h1,h2,h3,p {
  margin:0
}
h2,h3 {
  font-weight:500;
  letter-spacing:-.045em
}
p {
  line-height:1.65
}
img {
  display:block;
  max-width:100%
}
.skip-link {
  position:fixed;
  z-index:100;
  top:12px;
  left:12px;
  transform:translateY(-200%);
  background:white;
  padding:14px;
  color:var(--ink)
}
.skip-link:focus {
  transform:none
}
.site-header {
  height:96px;
  position:absolute;
  inset:0 0 auto;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 var(--gutter);
  color:#fff;
  border-bottom:1px solid #ffffff26
}
.brand {
  width:166px;
  flex-shrink:0;
  padding:8px 10px;
  background:white
}
.brand img {
  width:100%;
  height:auto
}
.site-nav {
  display:flex;
  align-items:center;
  gap:36px;
  font-size:14px;
  font-weight:500
}
.site-nav a {
  padding:14px 0
}
.site-nav a:hover {
  color:var(--accent)
}
.site-nav .nav-access {
  border:1px solid #ffffff60;
  padding:12px 22px
}
.nav-access span {
  margin-left:20px
}
.menu-toggle {
  display:none;
  color:white;
  border:1px solid #ffffff70;
  background:transparent;
  min-height:44px;
  padding:8px 14px
}
.cinema {
  position:relative;
  height:100svh;
  min-height:740px;
  background:var(--night);
  color:#f7fbfa
}
.cinema.has-video {
  height:310svh;
  min-height:1800px
}
.cinema-stage {
  position:sticky;
  top:0;
  height:100svh;
  min-height:740px;
  overflow:hidden
}
.cinema-media,.cinema-shade {
  position:absolute;
  inset:0
}
.cinema-poster,.cinema-video {
  position:absolute;
  right:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 48%
}
.cinema-poster {
  opacity:.84
}
.cinema-video {
  width:100%;
  opacity:0;
  transition:opacity .3s
}
.video-ready .cinema-video {
  opacity:1
}
.cinema-shade {
  background:linear-gradient(90deg,#070f21 3%,#070f21f5 22%,#070f219c 49%,#070f210a 85%),linear-gradient(0deg,#070f219e,transparent 24%,transparent 80%,#070f2160)
}
.hero-content {
  position:relative;
  z-index:2;
  padding:clamp(148px,20vh,220px) var(--gutter) 120px;
  max-width:980px
}
.eyebrow {
  font-size:11px;
  font-weight:600;
  letter-spacing:.16em;
  line-height:1.7;
  display:flex;
  align-items:center;
  gap:12px
}
.signal-dot {
  width:6px;
  height:6px;
  border-radius:50%;
  background:var(--accent);
  box-shadow:0 0 14px #40dfff66
}
.hero-content h1 {
  font-size:clamp(96px,11.5vw,176px);
  font-weight:500;
  letter-spacing:-.065em;
  line-height:1.05;
  margin:18px 0 22px
}
.brand-period {
  color:var(--accent)
}
.story-copy h2 {
  font-size:clamp(40px,4.6vw,68px);
  line-height:1.03;
  letter-spacing:-.045em
}
.story-copy p {
  color:#d6e1e5;
  font-size:17px;
  line-height:1.55;
  margin-top:22px;
  max-width:390px
}
.story-copy {
  min-height:227px
}
.hero-actions {
  display:flex;
  align-items:center;
  gap:30px;
  margin-top:26px
}
.button {
  min-height:54px;
  padding:16px 24px;
  display:inline-flex;
  justify-content:space-between;
  align-items:center;
  gap:36px;
  font-size:14px;
  font-weight:600;
  transition:background .2s,transform .2s
}
.button:hover {
  transform:translateY(-3px)
}
.button-light {
  background:#f5faf9;
  color:var(--ink)
}
.button-light:hover {
  background:var(--accent)
}
.button-dark {
  background:var(--ink);
  color:white
}
.button-dark:hover {
  background:#155468
}
.text-link {
  font-size:13px;
  line-height:1.6;
  padding:12px 0;
  border-bottom:1px solid #ffffff70;
  display:inline-flex;
  gap:20px
}
.text-link:hover {
  color:var(--accent)
}
.cinema-bottom {
  position:absolute;
  z-index:3;
  bottom:30px;
  left:var(--gutter);
  right:var(--gutter);
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  color:#d6e1e5
}
.scroll-cue {
  font-size:11px;
  display:flex;
  align-items:center;
  gap:16px
}
.scroll-cue>span {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:1px solid #ffffff40;
  border-radius:50%
}
.scene-index {
  font-size:11px;
  display:flex;
  align-items:center;
  gap:16px
}
.scene-line {
  width:115px;
  height:1px;
  background:#ffffff50
}
.scene-line i {
  display:block;
  height:1px;
  background:var(--accent);
  transform-origin:left;
  transform:scaleX(.05)
}
.motion-toggle {
  background:#070f21bb;
  border:1px solid #ffffff50;
  color:#fff;
  font-size:11px;
  min-height:44px;
  padding:8px 16px
}
.section-shell {
  padding:110px var(--gutter)
}
.dark {
  color:#46636d
}
.intro-heading {
  display:grid;
  grid-template-columns:1.25fr 1fr;
  align-items:end;
  gap:80px;
  margin:40px 0 75px
}
.intro h2,.workflow h2,.principles h2 {
  font-size:clamp(40px,4.7vw,70px);
  line-height:1.08
}
.intro h2 span {
  color:#6a828b
}
.intro-heading>p {
  font-size:18px;
  max-width:420px;
  padding-bottom:5px
}
.capabilities {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:32px
}
.capabilities article {
  border-top:1px solid var(--line);
  padding-top:26px
}
.step-number {
  font-size:12px;
  color:var(--muted)
}
.capabilities h3 {
  font-size:38px;
  margin:30px 0 16px
}
.capabilities p {
  font-size:15px;
  color:#46616c;
  max-width:310px
}
.capabilities a {
  display:inline-flex;
  gap:20px;
  margin-top:30px;
  font-size:12px;
  font-weight:600;
  padding:12px 0
}
.capabilities a:hover {
  color:#077b88
}
.workflow {
  background:#eaf0ef
}
.workflow-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:60px
}
.workflow-heading h2 {
  margin-top:30px
}
.workflow-heading>p {
  max-width:245px;
  font-size:17px;
  color:#48636e
}
.demo-tabs {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  margin-top:55px;
  border-bottom:1px solid #aebfc2;
  gap:0
}
.demo-tabs button {
  padding:18px 0;
  min-height:62px;
  text-align:left;
  border:0;
  border-bottom:3px solid transparent;
  background:transparent;
  color:#5c727c;
  font-size:13px
}
.demo-tabs button span {
  display:block;
  font-size:20px;
  margin-top:4px;
  letter-spacing:-.03em
}
.demo-tabs button[aria-selected=true] {
  color:var(--ink);
  border-bottom-color:var(--ink)
}
.demo-tabs button:hover {
  color:#246e4b
}
.demo-surface {
  margin-top:32px;
  background:#fff;
  box-shadow:0 14px 45px #0b34400a;
  border:1px solid #d5e0e0;
  border-radius:5px
}
.demo-top {
  border-bottom:1px solid #e1e8e8;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  padding:24px 30px;
  font-size:11px;
  color:#657b84
}
.demo-wordmark {
  font-size:17px;
  font-weight:700;
  letter-spacing:-.04em;
  color:var(--ink);
  margin-right:15px
}
.demo-label {
  font-size:10px
}
.demo-panel {
  padding:35px 30px 20px;
  min-height:349px
}
.panel-heading {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  margin-bottom:26px
}
.panel-heading .eyebrow {
  font-size:9px
}
.panel-heading h3 {
  font-size:27px;
  line-height:1.2;
  margin-top:8px
}
.panel-heading>p {
  font-size:11px;
  color:#637a84;
  max-width:200px
}
.schedule-hours {
  display:grid;
  grid-template-columns:118px repeat(5,1fr);
  font-size:10px;
  color:#6d828a;
  margin-bottom:12px
}
.schedule-hours span:last-child {
  text-align:right
}
.schedule-row {
  display:grid;
  grid-template-columns:118px 1fr;
  align-items:center;
  border-top:1px solid #e6eded;
  padding:10px 0;
  min-height:68px
}
.schedule-row>b {
  font-size:12px;
  font-weight:500
}
.schedule-track {
  position:relative;
  height:47px;
  background:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),#edf1f2 calc(25% - 1px),#edf1f2 25%)
}
.slot {
  position:absolute;
  left:var(--start);
  width:var(--length);
  height:100%;
  background:#d3edf4;
  border-left:2px solid #3a829d;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:6px 12px;
  font-size:11px;
  font-weight:500;
  border-radius:2px;
  color:#214352
}
.slot small {
  font-size:9px;
  color:#466571;
  margin-top:3px
}
.slot-muted {
  background:#e9eff2;
  border-left-color:#8197a6
}
.demo-footnote {
  padding:16px 30px 22px;
  color:#687e87;
  font-size:10px
}
.dark-link {
  border-color:#97afb6;
  color:var(--ink);
  margin-top:30px
}
.dark-link:hover {
  color:#246e4b
}
.status-row {
  display:grid;
  grid-template-columns:1fr 1fr 1.5fr;
  gap:15px;
  align-items:center;
  padding:20px 0;
  border-top:1px solid #e2e9e9;
  font-size:14px
}
.status-row b {
  font-weight:500
}
.status-row p {
  font-size:12px;
  color:#55717d
}
.status-active,.status-neutral {
  font-size:12px;
  display:flex;
  align-items:center;
  gap:8px
}
.status-active:before,.status-neutral:before {
  content:'';
  width:7px;
  height:7px;
  background:#32849c;
  border-radius:50%
}
.status-neutral:before {
  background:#8c9ea6
}
.metrics {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:40px;
  padding:10px 0 20px
}
.metrics>div {
  border-top:1px solid #d6e3e5;
  padding-top:20px
}
.metrics span {
  font-size:12px;
  color:#597269
}
.metrics strong {
  display:block;
  font-size:66px;
  letter-spacing:-.06em;
  line-height:1.4;
  font-weight:500
}
.metrics small {
  font-size:20px;
  letter-spacing:0;
  margin-left:6px
}
.metrics p {
  font-size:11px;
  color:#597269;
  max-width:190px
}
.principles {
  background:var(--night);
  color:#f4f8f7
}
.principles .eyebrow {
  color:#a5bec5
}
.principles-grid {
  display:grid;
  grid-template-columns:1.2fr 1fr;
  align-items:center;
  gap:60px;
  margin-top:45px
}
.principles h2 {
  font-size:clamp(35px,3.6vw,54px)
}
.principles h2 span {
  color:#91b1bb
}
.principles-grid>div>p {
  font-size:18px;
  max-width:370px;
  color:#d4e0e4
}
.principles ul {
  padding:0;
  list-style:none;
  margin:34px 0 0
}
.principles li {
  font-size:13px;
  border-top:1px solid #ffffff23;
  padding:15px 0;
  color:#c6d8dc
}
.principles li:before {
  content:'↗';
  color:var(--accent);
  margin-right:16px
}
.contact {
  padding-top:120px;
  padding-bottom:95px
}
.contact h2 {
  font-size:clamp(44px,6.4vw,96px);
  line-height:1.05;
  margin:36px 0 45px;
  letter-spacing:-.055em
}
.contact h2>span {
  color:#058594
}
.contact-bottom {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px
}
.contact-bottom p {
  font-size:17px;
  color:#52717b
}
.contact-email {
  display:inline-block;
  margin-top:30px;
  font-size:14px;
  border-bottom:1px solid #a7bcc1;
  padding:8px 0
}
.site-footer {
  border-top:1px solid #ccd8d9;
  margin:0 var(--gutter);
  padding:42px 0;
  display:flex;
  align-items:start;
  justify-content:space-between;
  gap:30px
}
.site-footer>a {
  font-size:37px;
  font-weight:600;
  letter-spacing:-.06em;
  line-height:1
}
.site-footer>a>span {
  color:#078797
}
.site-footer p {
  font-size:12px;
  line-height:1.8
}
.site-footer p>span {
  color:#70868f
}
.site-footer nav {
  display:flex;
  flex-direction:column;
  gap:14px;
  font-size:12px
}
.site-footer small {
  font-size:10px;
  color:#6d838b
}
.site-footer a:hover {
  color:#067a87
}
@keyframes enter {
  from {
    opacity:0;
    transform:translateY(20px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }
}
@media(prefers-reduced-motion:no-preference) {
  .hero-content>* {
    animation:enter .8s ease-out both
  }
  .hero-content>h1 {
    animation-delay:.12s
  }
  .story-copy {
    animation-delay:.24s
  }
  .hero-actions {
    animation-delay:.36s
  }
  .reveal {
    opacity:0;
    transform:translateY(24px);
    transition:opacity .7s,transform .7s
  }
  .reveal.visible {
    opacity:1;
    transform:none
  }
}
@media(min-width:1700px) {
  .hero-content {
    padding-top:23vh
  }
  .story-copy {
    min-height:245px
  }
}
@media(max-height:820px) and (min-width:801px) {
  .cinema,.cinema-stage {
    min-height:680px
  }
  .hero-content {
    padding-top:130px
  }
  .hero-content h1 {
    font-size:114px;
    margin:12px 0
  }
  .story-copy h2 {
    font-size:48px
  }
  .story-copy {
    min-height:180px
  }
  .story-copy p {
    font-size:15px;
    margin-top:17px
  }
  .hero-actions {
    margin-top:18px
  }
}
@media(max-width:1000px) {
  .site-nav {
    gap:22px
  }
  .intro-heading {
    gap:40px
  }
  .capabilities {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:36px 28px
  }
  .principles-grid {
    gap:40px
  }
  .hero-actions {
    gap:22px
  }
  .hero-actions .text-link {
    font-size:12px
  }
}
@media(max-width:800px) {
  :root {
    scroll-padding-top:24px
  }
  .site-header {
    height:82px
  }
  .brand {
    width:136px
  }
  .menu-toggle:not([hidden]) {
    display:block
  }
  .js .site-nav {
    display:none
  }
  .js .site-nav.open {
    display:flex;
    position:absolute;
    top:81px;
    left:0;
    right:0;
    background:#082431;
    flex-direction:column;
    gap:0;
    align-items:stretch;
    padding:16px var(--gutter) 26px;
    border-bottom:1px solid #ffffff40
  }
  .site-nav .nav-access {
    margin-top:8px
  }
  .site-nav a {
    min-height:48px
  }
  .cinema,.cinema-stage {
    min-height:740px
  }
  .hero-content {
    padding-top:160px
  }
  .hero-content h1 {
    font-size:112px
  }
  .story-copy h2 {
    font-size:52px
  }
  .cinema-poster {
    width:100%;
    object-position:76% 45%
  }
  .cinema-shade {
    background:linear-gradient(90deg,#070f21f2,#070f21ad 60%,#070f214d),linear-gradient(0deg,#070f21bb,transparent)
  }
  .section-shell {
    padding:80px var(--gutter)
  }
  .intro-heading {
    grid-template-columns:1fr;
    gap:25px;
    margin:30px 0 55px
  }
  .intro-heading>p {
    max-width:560px
  }
  .workflow-heading {
    align-items:start;
    flex-direction:column;
    gap:24px
  }
  .workflow-heading>p {
    max-width:350px
  }
  .principles-grid {
    grid-template-columns:1fr;
    gap:32px
  }
  .principles-grid>div>p {
    max-width:540px
  }
  .site-footer {
    flex-wrap:wrap
  }
  .site-footer small {
    width:100%
  }
  .panel-heading>p {
    max-width:150px
  }
  .no-js .site-nav {
    gap:10px;
    font-size:10px
  }
  .no-js .site-header {
    position:relative;
    height:auto;
    padding-top:16px;
    padding-bottom:16px;
    background:var(--night)
  }
}
@media(max-width:560px) {
  .cinema,.cinema-stage {
    height:100svh;
    min-height:700px
  }
  .cinema.has-video {
    height:270svh;
    min-height:1600px
  }
  .hero-content {
    padding:148px var(--gutter) 105px
  }
  .hero-content .eyebrow {
    font-size:8px;
    letter-spacing:.12em;
    gap:8px
  }
  .hero-content h1 {
    font-size:clamp(77px,22vw,118px);
    margin:20px 0 25px
  }
  .story-copy {
    min-height:210px
  }
  .story-copy h2 {
    font-size:44px
  }
  .story-copy p {
    font-size:15px;
    max-width:300px;
    margin-top:20px
  }
  .hero-actions {
    flex-direction:column;
    align-items:start;
    gap:12px;
    margin-top:20px
  }
  .hero-actions .button {
    min-height:50px;
    padding:14px 20px
  }
  .hero-actions .text-link {
    font-size:12px;
    padding:8px 0
  }
  .cinema-poster {
    width:100%;
    right:0;
    object-position:40% 50%
  }
  .cinema-shade {
    background:linear-gradient(90deg,#070f21eb,#070f2199),linear-gradient(0deg,#070f21dd,transparent)
  }
  .cinema-bottom {
    bottom:24px;
    gap:12px
  }
  .scroll-cue {
    font-size:9px;
    gap:10px
  }
  .scroll-cue>span {
    width:27px;
    height:27px
  }
  .scene-line {
    width:35px
  }
  .scene-index {
    gap:8px;
    font-size:9px
  }
  .motion-toggle {
    position:absolute;
    right:0;
    bottom:42px;
    font-size:10px
  }
  .section-shell {
    padding:64px var(--gutter)
  }
  .eyebrow {
    font-size:9px
  }
  .intro h2,.workflow h2 {
    font-size:44px
  }
  .intro-heading>p {
    font-size:16px
  }
  .capabilities {
    grid-template-columns:1fr;
    gap:36px
  }
  .capabilities article {
    position:relative;
    padding-left:42px;
    padding-top:24px
  }
  .step-number {
    position:absolute;
    top:32px;
    left:0
  }
  .capabilities h3 {
    margin:0 0 12px;
    font-size:34px
  }
  .capabilities p {
    max-width:100%
  }
  .capabilities a {
    margin-top:14px
  }
  .demo-tabs {
    margin-top:32px
  }
  .demo-tabs button {
    font-size:11px;
    padding:14px 0
  }
  .demo-tabs button span {
    font-size:15px
  }
  .demo-surface {
    margin-top:20px
  }
  .demo-top {
    padding:20px 18px;
    flex-direction:column;
    align-items:start;
    gap:8px
  }
  .demo-panel {
    padding:24px 18px 10px;
    min-height:367px
  }
  .panel-heading {
    display:block;
    margin-bottom:20px
  }
  .panel-heading h3 {
    font-size:23px
  }
  .panel-heading>p {
    max-width:none;
    margin-top:10px;
    font-size:10px
  }
  .schedule-hours {
    grid-template-columns:68px repeat(5,1fr);
    font-size:8px
  }
  .schedule-row {
    grid-template-columns:68px 1fr;
    min-height:67px
  }
  .schedule-row>b {
    font-size:9px;
    max-width:40px;
    line-height:1.5
  }
  .slot {
    font-size:8px;
    padding:4px;
    line-height:1.4
  }
  .slot small {
    font-size:7px
  }
  .demo-footnote {
    padding:14px 18px 22px;
    font-size:9px
  }
  .status-row {
    grid-template-columns:1fr 1fr;
    gap:8px;
    padding:13px 0;
    font-size:12px
  }
  .status-row p {
    grid-column:1/-1;
    font-size:11px
  }
  .status-active,.status-neutral {
    font-size:11px
  }
  .metrics {
    gap:12px;
    padding-top:0
  }
  .metrics strong {
    font-size:38px;
    line-height:1.8
  }
  .metrics small {
    font-size:12px;
    margin-left:3px
  }
  .metrics span {
    font-size:10px;
    line-height:1.4;
    display:block;
    min-height:28px
  }
  .metrics p {
    font-size:10px
  }
  .metrics>div {
    padding-top:12px
  }
  .principles h2 {
    font-size:37px
  }
  .principles-grid>div>p {
    font-size:16px
  }
  .contact h2 {
    font-size:clamp(37px,9.4vw,55px);
    margin:27px 0 30px
  }
  .contact-bottom {
    align-items:start;
    flex-direction:column;
    gap:26px
  }
  .contact-bottom p {
    font-size:15px
  }
  .site-footer {
    gap:25px;
    padding:34px 0
  }
  .site-footer>a {
    font-size:33px
  }
  .site-footer>p {
    font-size:10px
  }
  .site-footer nav {
    width:100%
  }
  .site-footer small {
    font-size:9px
  }
}
@media(prefers-reduced-motion:reduce) {
  :root {
    scroll-behavior:auto
  }
  /* Las órbitas se pausan en su fase; no se elimina su animación. */
  *:not(.lirien-orbital__rotor):not(.lirien-orbital__counter),*:before,*:after {
    animation:none!important;
    transition:none!important
  }
  .cinema.has-video {
    height:100svh;
    min-height:700px
  }
  .cinema-video {
    display:none
  }
}
/* Encuadre continuo, incluso cuando la imagen excede el viewport móvil. */ .cinema-poster {
  max-width:none
}
@media(max-width:560px) and (max-height:740px) {
  .cinema:not(.has-video),.cinema-stage {
    min-height:100svh
  }
  .hero-content {
    padding-top:112px;
    padding-bottom:65px
  }
  .hero-content h1 {
    font-size:76px;
    margin:10px 0 18px
  }
  .story-copy {
    min-height:170px
  }
  .story-copy h2 {
    font-size:36px
  }
  .story-copy p {
    font-size:14px;
    margin-top:15px
  }
  .hero-actions {
    margin-top:12px
  }
  .hero-actions .text-link {
    display:none
  }
  .cinema-bottom {
    bottom:15px
  }
  .hero-actions .button {
    min-height:46px;
    padding:12px 20px
  }
}
.no-js .demo-tabs {
  display:none
}
.no-js .demo-panel[hidden] {
  display:block!important
}
@media(max-width:800px) {
  .no-js .site-header {
    flex-wrap:wrap;
    gap:16px
  }
  .no-js .site-nav {
    width:100%;
    display:flex;
    flex-wrap:wrap
  }
  .no-js .site-nav .nav-access {
    margin:0
  }
}

/* Seguimiento de #1072 (24-sep-2026): piso de legibilidad de 12 px,
   objetivos táctiles de 44 px y encuadre propio para pantallas verticales.
   El piso global solo sube lo que estaba bajo 12 px; el resto del
   escritorio conserva su diseño. */
.eyebrow,
.scroll-cue,
.scene-index,
.motion-toggle,
.demo-top,
.demo-label,
.panel-heading .eyebrow,
.panel-heading>p,
.schedule-hours,
.slot,
.slot small,
.demo-footnote,
.metrics p,
.site-footer small {
  font-size:12px
}
.slot {
  line-height:1.3
}
/* Objetivos táctiles solo donde se toca con el dedo: en escritorio con
   mouse el pie y los enlaces de texto mantienen su tamaño compacto. */
@media(max-width:800px),(pointer:coarse) {
  .scroll-cue,
  .motion-toggle {
    font-size:13px;
    min-height:44px
  }
  .scroll-cue>span {
    width:36px;
    height:36px
  }
  .text-link,
  .capabilities a,
  .contact-email,
  .site-footer>a,
  .site-footer nav a {
    display:inline-flex;
    align-items:center;
    min-height:44px
  }
  .text-link {
    font-size:14px
  }
  .capabilities a,
  .site-footer p {
    font-size:13px
  }
  .site-footer nav {
    font-size:14px;
    gap:0
  }
}
@media(max-width:800px) {
  /* Navegación de respaldo sin JavaScript. */
  .no-js .site-nav {
    font-size:12px
  }
}
@media(max-width:560px) {
  .hero-content .eyebrow {
    font-size:12px;
    letter-spacing:.08em
  }
  .hero-actions .text-link {
    font-size:14px;
    padding:10px 0
  }
  .scroll-cue {
    font-size:12px
  }
  .scroll-cue>span {
    width:36px;
    height:36px
  }
  .scene-index,
  .eyebrow,
  .demo-tabs button,
  .demo-footnote,
  .metrics span,
  .metrics p,
  .site-footer small {
    font-size:12px
  }
  .motion-toggle,
  .panel-heading>p,
  .status-row p,
  .status-active,
  .status-neutral,
  .site-footer>p {
    font-size:13px
  }
  /* El ejemplo de programación se desplaza en horizontal en vez de encoger
     el texto a 7-9 px para caber en 390 px. */
  .schedule {
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:6px
  }
  .schedule-hours,
  .schedule-row {
    min-width:560px
  }
  .schedule-hours {
    grid-template-columns:92px repeat(5,1fr);
    font-size:12px
  }
  .schedule-row {
    grid-template-columns:92px 1fr
  }
  .schedule-row>b {
    font-size:13px;
    max-width:none
  }
  .slot {
    font-size:12px;
    padding:5px 8px
  }
  .slot small {
    font-size:12px
  }
}
@media(max-aspect-ratio:4/5) {
  .cinema-poster,
  .cinema-video {
    object-position:50% 50%
  }
  .cinema-poster {
    opacity:.9
  }
  .cinema-shade {
    background:linear-gradient(180deg,#070f21b3 0%,#070f2194 30%,#070f21bd 56%,#070f21eb 78%,#070f21f7 100%)
  }
  /* El título y la etiqueta quedan sobre el brillo de la lámpara. */
  .hero-content {
    text-shadow:0 1px 14px #070f21d9
  }
}

/* Enlaces públicos destacados al salir de la portada. */
.public-resources {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  padding:24px var(--gutter);
  gap:24px;
  background:var(--accent);
  color:var(--ink)
}
.public-resources a {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  min-height:64px;
  padding:12px 0;
  font-size:clamp(22px,2.6vw,34px);
  font-weight:600;
  border-bottom:2px solid currentColor
}
.public-resources a:hover {
  text-decoration:underline;
  text-underline-offset:6px
}
.public-resources a:focus-visible {
  outline-color:var(--ink)
}
@media(max-width:560px) {
  .public-resources {
    grid-template-columns:1fr;
    gap:8px
  }
}

/* Imágenes aportadas por el founder, con textos fuera de la fotografía. */
.coordination-visual,
.bedside-visual {
  margin:0;
  min-width:0
}
.coordination-visual {
  margin-top:64px
}
.coordination-visual img,
.bedside-visual img {
  display:block;
  width:100%;
  height:auto
}
.coordination-visual img {
  aspect-ratio:16/9;
  object-fit:cover;
  object-position:center 42%
}
.coordination-visual figcaption,
.bedside-visual figcaption {
  margin-top:12px;
  font-size:12px;
  line-height:1.5;
  color:var(--muted)
}
.bedside-visual figcaption {
  color:#a5bec5
}
.principles-grid h2 {
  margin-bottom:24px
}

/* La L ocupa el fondo completo; el velo izquierdo conserva la lectura. */
.orbital-hero,
.orbital-hero .cinema-stage {
  height:auto;
  min-height:max(720px,100svh)
}
.orbital-hero .cinema-stage {
  position:relative;
  isolation:isolate;
  display:flex;
  align-items:center;
  padding:140px var(--gutter) 100px;
  background:radial-gradient(circle at 72% 48%,#10364f 0%,#0a2038 28%,#070f21 68%)
}
.orbital-hero .cinema-stage::after {
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:linear-gradient(90deg,#070f21 4%,#070f21f7 30%,#070f218c 52%,#070f2100 80%)
}
.orbital-hero .hero-content {
  z-index:2;
  width:min(100%,760px);
  padding:0
}
.orbital-hero .hero-content h1 {
  font-size:clamp(90px,10vw,164px)
}
.orbital-hero .story-copy {
  min-height:0
}
.orbital-hero .hero-actions {
  flex-wrap:wrap;
  gap:16px 24px
}
.hero-orbital {
  position:absolute;
  z-index:0;
  width:min(94vw,1120px);
  top:50%;
  right:-7%;
  transform:translateY(-50%);
  pointer-events:none
}
#orbital-visual {
  aspect-ratio:1
}
#orbital-visual .lirien-orbital {
  --orbital-accent:#7aeaff;
  filter:drop-shadow(0 0 26px #40dfff3d)
}
#orbital-visual .lirien-orbital__track {
  stroke-width:1.2
}
.orbital-motion {
  position:absolute;
  z-index:4;
  right:var(--gutter);
  bottom:30px;
  min-height:44px;
  padding:10px 16px;
  border:1px solid #40dfff7a;
  background:#070f21ba;
  color:#e8f5f6;
  font-size:12px;
  white-space:nowrap
}
.orbital-motion:hover:not(:disabled) {
  color:var(--accent);
  border-color:var(--accent)
}
/* Sin JS no queda un cuadrado vacío en la portada. */
#orbital-visual:empty {
  display:none
}
@media(max-width:800px) {
  .orbital-hero,
  .orbital-hero .cinema-stage {
    min-height:100svh
  }
  .orbital-hero .cinema-stage {
    display:block;
    padding:112px var(--gutter) 32px;
    background:radial-gradient(circle at 50% 40%,#123d58 0%,#0b223a 34%,#070f21 82%)
  }
  .orbital-hero .cinema-stage::after {
    background:linear-gradient(180deg,#070f2180 0%,#070f2100 25%,#070f2100 56%,#070f21c9 77%,#070f21 100%)
  }
  .orbital-hero .hero-content {
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    min-height:calc(100svh - 144px)
  }
  .orbital-hero .hero-content h1 {
    font-size:clamp(52px,11vw,72px);
    margin:10px 0 0
  }
  .hero-orbital {
    width:max(125vw,480px);
    top:43%;
    left:50%;
    right:auto;
    transform:translate(-50%,-50%)
  }
  .orbital-motion {
    top:58%;
    left:50%;
    right:auto;
    bottom:auto;
    transform:translateX(-50%)
  }
  .orbital-hero .story-copy {
    margin-top:auto
  }
  .orbital-hero .story-copy h2 {
    font-size:clamp(30px,8vw,40px)
  }
  .orbital-hero .story-copy h2 br {
    display:none
  }
  .orbital-hero .story-copy p {
    font-size:15px;
    margin-top:12px
  }
  .orbital-hero .hero-actions {
    margin-top:18px
  }
  .orbital-hero .hero-actions .text-link,
  .orbital-hero .cinema-bottom {
    display:none
  }
}
@media(max-width:560px) and (max-height:740px) {
  .orbital-hero .cinema-stage {
    padding-top:96px;
    padding-bottom:22px
  }
  .orbital-hero .hero-content {
    min-height:calc(100svh - 118px)
  }
  .orbital-hero .hero-content h1 {
    font-size:52px
  }
  .orbital-hero .story-copy h2 {
    font-size:30px
  }
  .hero-orbital {
    top:42%
  }
}
@media(max-width:800px) and (max-height:620px) and (orientation:landscape) {
  .orbital-hero .cinema-stage::after {
    background:linear-gradient(90deg,#070f21 0%,#070f21f2 44%,#070f2199 69%,#070f2100 100%)
  }
  .hero-orbital {
    left:74%
  }
  .orbital-motion {
    top:calc(100svh - 60px - env(safe-area-inset-bottom));
    left:auto;
    right:var(--gutter);
    bottom:auto;
    transform:none
  }
}
@media(min-width:561px) and (max-width:800px) and (max-height:400px) and (orientation:landscape) {
  .orbital-hero .cinema-stage {
    padding-top:72px;
    padding-bottom:16px
  }
  .orbital-hero .hero-content h1 {
    font-size:44px
  }
  .orbital-hero .story-copy h2 {
    font-size:30px
  }
  .orbital-hero .story-copy p {
    margin-top:6px
  }
  .orbital-hero .hero-actions {
    margin-top:10px
  }
}
@media(min-width:801px) and (max-height:720px) and (orientation:landscape) {
  .orbital-motion {
    top:calc(100svh - 64px);
    bottom:auto
  }
}
@media(min-width:801px) and (max-height:650px) and (orientation:landscape) {
  .site-header {
    height:72px
  }
  .brand {
    width:140px
  }
  .orbital-hero .cinema-bottom {
    display:none
  }
  .orbital-hero,
  .orbital-hero .cinema-stage {
    min-height:100svh
  }
  .orbital-hero .cinema-stage {
    display:block;
    padding:72px var(--gutter) calc(16px + env(safe-area-inset-bottom))
  }
  .orbital-hero .cinema-stage::after {
    background:linear-gradient(90deg,#070f21 0%,#070f21f2 44%,#070f2199 69%,#070f2100 100%)
  }
  .orbital-hero .hero-content {
    display:flex;
    flex-direction:column;
    min-height:calc(100svh - 108px - env(safe-area-inset-bottom))
  }
  .orbital-hero .hero-content h1 {
    font-size:44px;
    margin:6px 0 0
  }
  .orbital-hero .story-copy {
    margin-top:auto
  }
  .orbital-hero .story-copy h2 {
    font-size:30px
  }
  .orbital-hero .story-copy p {
    font-size:15px;
    margin-top:6px
  }
  .orbital-hero .hero-actions {
    margin-top:10px
  }
  .hero-orbital {
    width:80vw;
    top:50%;
    right:-12%
  }
  .orbital-motion {
    top:calc(100svh - 60px - env(safe-area-inset-bottom));
    bottom:auto
  }
}
@media(min-width:801px) and (max-height:350px) and (orientation:landscape) {
  .site-header {
    height:56px
  }
  .brand {
    width:130px;
    padding:6px 8px
  }
  .orbital-hero .cinema-stage {
    padding-top:56px
  }
  .orbital-hero .hero-content h1 {
    font-size:36px
  }
  .orbital-hero .story-copy h2 {
    font-size:24px
  }
  .orbital-hero .story-copy p {
    font-size:14px;
    line-height:1.35
  }
}
@media(max-width:560px) and (max-height:520px) and (orientation:portrait) {
  .orbital-hero .cinema-stage::after {
    background:linear-gradient(180deg,#070f2180 0%,#070f2166 38%,#070f21c9 58%,#070f21 82%)
  }
}
@media(max-width:560px) and (max-height:620px) {
  .orbital-hero .cinema-stage {
    padding-top:84px;
    padding-bottom:16px
  }
  .orbital-hero .hero-content {
    min-height:calc(100svh - 120px)
  }
  .orbital-hero .hero-content h1 {
    font-size:44px
  }
  .orbital-hero .story-copy p {
    margin-top:6px
  }
  .orbital-hero .hero-actions {
    margin-top:10px
  }
  .hero-orbital {
    top:40%
  }
}
@media(max-width:560px) and (max-height:620px) and (orientation:portrait) {
  .orbital-motion {
    top:144px;
    left:auto;
    right:var(--gutter);
    transform:none
  }
}
@media(max-width:399px) and (max-height:620px) and (orientation:landscape) {
  .orbital-hero .hero-content {
    min-height:0
  }
  .orbital-hero .story-copy {
    margin-top:12px
  }
  .orbital-motion {
    position:relative;
    top:auto;
    right:auto;
    left:auto;
    bottom:auto;
    transform:none;
    margin-top:36px
  }
}
@media(max-width:560px) {
  .coordination-visual {
    margin-top:40px
  }
  .coordination-visual img {
    aspect-ratio:4/3
  }
}

/* Señales → centro operacional. Mejora progresiva: sin JS queda la portada. */
.network-heading,.network-caption,.network-sources { display:none }
.has-flow:not(.flow-static) { height:240svh; min-height:0 }
.has-flow:not(.flow-static) .cinema-stage {
  position:sticky; top:0; height:100svh; min-height:100svh
}
.has-flow .hero-content {
  opacity:var(--intro-alpha,1);
  transform:translateY(calc((1 - var(--intro-alpha,1)) * -24px));
}
.has-flow[data-network-active=true] .hero-content { pointer-events:none }
.has-flow .hero-orbital { right:auto; transform:translate(-50%,-50%) }
.has-flow .cinema-stage::after { opacity:var(--intro-alpha,1) }
.has-flow .network-sources { display:block; opacity:var(--network-alpha,0) }
.has-flow .network-heading,.has-flow .network-caption {
  display:block; position:absolute; left:0; width:100%; text-align:center;
  opacity:var(--network-alpha,0); color:#e4f7ff; margin:0; font-weight:500;
}
.network-heading { top:-8%; font-size:clamp(18px,2.5vw,32px); letter-spacing:-.035em }
.network-caption { bottom:-7%; font-size:15px }
.network-caption span { display:block; margin-top:8px; color:#9fbac9; font-size:11px; font-weight:400 }
.network-source { position:absolute; margin:0; width:22%; transform:translate(-50%,-50%) }
.network-source figcaption { padding:8px 0; color:#bcf2ff; font-size:clamp(10px,1vw,13px); text-align:center; white-space:nowrap }
.source-pre { left:13.67%; top:23.33% }
.source-plan { left:86.33%; top:23.33% }
.source-live { left:13.67%; top:76.67% }
.source-data { left:86.33%; top:76.67% }
.flow-arrow { stroke:var(--accent); stroke-width:.8 }
.has-flow .cinema-bottom { opacity:var(--intro-alpha,1) }
.has-flow[data-network-active=true] .cinema-bottom { visibility:hidden }
.flow-static { height:auto; min-height:0 }
.flow-static .cinema-stage { display:block; height:auto; min-height:0; padding:100px var(--gutter) 32px }
.flow-static .hero-content { min-height:0; width:min(100%,760px); transform:none }
.flow-static .story-copy { margin-top:16px }
.flow-static .hero-orbital {
  position:relative; width:min(100%,700px)!important; left:auto!important; top:auto!important;
  transform:none; margin:90px auto 70px
}
.flow-static .orbital-motion { position:relative; top:auto; right:auto; left:auto; bottom:auto; transform:none; margin:0 }
.flow-static .cinema-bottom { display:none }
.flow-static .cinema-stage::after { display:none }
.flow-static .network-heading { top:-10% }
.flow-static .hero-content h1 { font-size:clamp(44px,10vw,110px) }
.flow-static .story-copy h2 { font-size:clamp(30px,4.5vw,54px) }
.capabilities { grid-template-columns:repeat(3,1fr) }
.flow-sequence { display:flex; flex-wrap:wrap; gap:12px 24px; list-style:none; margin:36px 0 18px; padding:0; font-weight:500; font-size:16px }
.flow-sequence li:not(:last-child)::after { content:'→'; margin-left:24px; color:#17647b }
.flow-sequence li:last-child::after { content:'↺'; margin-left:24px; color:#17647b }
.feedback-line { color:#41616e; font-size:14px; max-width:720px; margin-bottom:44px }
.feedback-line>span { color:#17647b; font-size:22px; margin-right:8px }
.demo-tabs { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); overflow:visible }
.demo-tabs button { min-width:0; padding:20px 12px; text-align:left }
.demo-tabs button span { display:block }
.signal-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; padding:30px 0 }
.signal-summary p { font-size:16px }
.signal-summary span { display:block; color:#17647b; font-size:12px; text-transform:uppercase; letter-spacing:.12em; margin-bottom:18px }
.prediction-demo { display:grid; grid-template-columns:1fr 1.3fr 1.3fr; gap:40px; align-items:center; padding:30px 0 }
.prediction-demo>div>span { display:block; font-size:13px; color:#41616e; margin-bottom:14px }
.prediction-demo strong { display:block; font-size:60px; line-height:1; font-weight:500; letter-spacing:-.05em }
.prediction-demo small { font-size:18px }
.prediction-demo p { font-size:15px; margin-top:16px }
.prediction-track i { display:block; width:var(--value); height:10px; background:#17647b; margin:0 0 28px; border-radius:0 5px 5px 0 }
.prediction-track i:last-child { background:#7795a4; margin-bottom:0 }
.agent-note { border-top:1px solid var(--line); padding-top:20px; font-size:13px; color:#41616e; max-width:760px }
@media(max-width:800px) {
  .has-flow:not(.flow-static) .cinema-stage { padding-top:112px; padding-bottom:32px }
  .has-flow:not(.flow-static) .hero-content { min-height:calc(100svh - 200px - env(safe-area-inset-bottom)) }
  .has-flow .orbital-motion { top:auto; bottom:calc(22px + env(safe-area-inset-bottom)); left:auto; right:var(--gutter); transform:none }
  .has-flow .network-heading { top:-20%; font-size:24px; padding:0 20px }
  .has-flow .network-caption { bottom:-20%; font-size:13px; padding:0 20px }
  .has-flow .network-source figcaption { white-space:normal; font-size:10px; line-height:1.4 }
  .has-flow .network-source { width:26% }
  .has-flow .hero-content h1 { font-size:clamp(44px,10vw,72px) }
  .has-flow .story-copy h2 { font-size:clamp(28px,6vw,40px) }
  .has-flow .story-copy p { font-size:14px }
  .flow-static .cinema-stage { padding-top:100px; padding-bottom:32px }
  .flow-static .hero-content { min-height:0 }
  .flow-static .hero-orbital { margin-top:100px; margin-bottom:100px }
  .flow-static .orbital-motion { position:relative; top:auto; right:auto; bottom:auto; left:auto; margin:0 }
  .capabilities { grid-template-columns:1fr }
  .demo-tabs { grid-template-columns:repeat(3,minmax(0,1fr)); gap:1px }
  .demo-tabs button { padding:16px 12px; border-bottom:1px solid var(--line); font-size:12px }
  .demo-tabs button span { font-size:14px }
  .signal-summary,.prediction-demo { grid-template-columns:1fr; gap:24px; padding:20px 0 }
  .signal-summary span { margin-bottom:8px }
  .flow-sequence { gap:12px 16px; font-size:14px }
  .flow-sequence li:not(:last-child)::after,.flow-sequence li:last-child::after { margin-left:16px }
}
@media(max-width:560px) and (min-height:501px) and (max-height:740px) {
  .has-flow:not(.flow-static) .cinema-stage { padding-top:96px; padding-bottom:90px }
  .has-flow:not(.flow-static) .hero-content { min-height:calc(100svh - 210px - env(safe-area-inset-bottom)) }
  .has-flow:not(.flow-static) .cinema-stage::after { background:linear-gradient(180deg,#070f214d 0%,#070f2100 30%,#070f21cc 48%,#070f21f7 70%,#070f21 100%) }
  .has-flow .network-heading { top:-16%; font-size:20px }
  .has-flow .network-caption { bottom:-20% }
}
@media(prefers-reduced-motion:reduce) {
  .has-flow .hero-content { opacity:1; transform:none }
}
.has-flow .network-heading { top:38px; padding:0 var(--gutter); font-size:clamp(20px,2.5vw,32px) }
.has-flow .network-caption { bottom:76px; padding:0 var(--gutter); font-size:14px }
.has-flow:not(.flow-static)[data-network-active=false] .network-heading,
.has-flow:not(.flow-static)[data-network-active=false] .network-caption,
.has-flow:not(.flow-static)[data-network-active=false] .network-sources { visibility:hidden }
.flow-static .network-heading,.flow-static .network-caption { position:relative; top:auto; bottom:auto; left:auto; padding:0 }
.flow-static .network-heading { margin:40px 0 0 }
.flow-static .network-caption { margin:0 0 24px }
.flow-static .hero-orbital { margin:20px auto }
@media(max-width:800px) {
  .has-flow .network-heading { top:40px; font-size:24px }
  .has-flow .network-caption { bottom:84px; font-size:13px }
  .flow-static .network-heading,.flow-static .network-caption { top:auto; bottom:auto }
}
@media(max-width:560px) {
  .demo-tabs { grid-template-columns:repeat(2,minmax(0,1fr)) }
  .demo-tabs button:last-child { grid-column:1/-1 }
}
@media(min-width:801px) and (max-height:650px) {
  .has-flow:not(.flow-static) .network-caption { bottom:64px }
}

/* Red multivectorial: seis símbolos, sin fotografías duplicadas. */
.network-symbol { display:block; width:48%; height:auto; margin:auto; aspect-ratio:1; fill:none; stroke:var(--accent); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; border:1px solid #40dfff66; border-radius:12px; background:#0b2036; box-shadow:0 0 18px #40dfff22; padding:8% }
.source-agent { left:8.33%; top:50% }
.source-feedback { left:91.67%; top:50% }
.has-flow .flow-vector { stroke:var(--accent); stroke-width:1.15; filter:drop-shadow(0 0 3px #40dfff) }
.has-flow .flow-branch { fill:none; stroke-width:.8 }
.has-flow .lirien-orbital__dot { fill:#d9faff; filter:drop-shadow(0 0 4px #40dfff) }
.has-flow .lirien-orbital__halo { fill:#40dfff; opacity:.3 }
@media(max-width:800px) { .has-flow .network-source { width:22% } .network-symbol { width:60%; padding:8%; border-radius:8px } }

.has-flow .flow-pulse { stroke:#66eaff; stroke-width:2.2; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 4px #17cfff) drop-shadow(0 0 8px #00aaff) }
.network-symbol { border-color:#40dfff99; box-shadow:0 0 18px #40dfff33; stroke-width:1.8 }

.site-header :is(a,button):focus-visible,
.orbital-hero :is(a,button,[tabindex]):focus-visible { outline-color:#40dfff }