/* Activación: indicaciones claras, cotización directa y vista móvil de Solaria App. */
.product-nav button[aria-current="true"] {
  color: #111320;
  background: #f7f7ff;
  box-shadow: inset 0 0 0 2px rgba(var(--accent-rgb), .78), 0 0 16px rgba(var(--accent-rgb), .3);
}
.product-nav button:focus-visible,
.agobio-next:focus-visible,
.quote-panel a:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.agobio-next { display: none; }
.agobio-mobile-art { display: none; }

.quote-panel { background: #0b0d18; }
.quote-scroll { height: 100%; overflow-y: auto; }
.quote-layout {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
  align-items: center;
  gap: clamp(30px, 6vw, 100px);
  width: min(1320px, 100%);
  min-height: 100%;
  margin: auto;
  padding: calc(var(--header-h) + 60px) clamp(24px, 6vw, 92px) calc(var(--footer-h) + 48px);
}
.quote-copy { position: relative; z-index: 2; max-width: 700px; }
.quote-copy .eyebrow { color: #a8baf8; }
.quote-copy h2 {
  margin: 20px 0 28px;
  color: #fff;
  font-size: clamp(3.5rem, 7vw, 7.8rem);
  line-height: .92;
  letter-spacing: -.07em;
}
.quote-copy h2 em { color: #9ecffc; font-style: normal; }
.quote-lede { max-width: 38ch; color: #f4f6ff; font-size: clamp(1.08rem, 1.6vw, 1.5rem); line-height: 1.48; }
.quote-note { max-width: 47ch; margin: 20px 0 0; color: #aeb7d0; font-size: .93rem; line-height: 1.6; }
.quote-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 32px 0 24px; }
.quote-actions .primary-action { background: #c4e6fc; color: #111b2c; }
.quote-actions .secondary-action { border-color: #67718c; color: #f4f6ff; }
.quote-actions a { text-decoration: none; }
.quote-contact { color: #aeb7d0; font-size: .85rem; }
.quote-contact a { color: #fff; font-weight: 700; text-underline-offset: 3px; }
.quote-visual {
  position: relative;
  display: grid;
  place-items: center;
  min-height: min(54vw, 550px);
  isolation: isolate;
}
.quote-visual::before {
  content: "";
  position: absolute;
  width: min(40vw, 450px);
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, #5cc6e833, #7b5fd622 42%, transparent 70%);
  filter: blur(12px);
}
.quote-visual > .ai-presence { position: relative; width: clamp(140px, 21vw, 270px); height: clamp(140px, 21vw, 270px); transform: none; }
.quote-orbit { position: absolute; width: min(34vw, 390px); aspect-ratio: 1; border: 1px solid #b5d9f838; border-radius: 50%; }
.quote-orbit-two { width: min(46vw, 530px); border-color: #b5d9f820; }
.quote-visual span { position: absolute; bottom: 6%; color: #bcc9e5; font-size: .8rem; letter-spacing: .08em; line-height: 1.5; text-align: center; text-transform: uppercase; }

/* El teléfono lleva el peso visual; el CRM web acompaña detrás. */
#solaria-app .app-laptop { width: min(40vw, 540px); }
#solaria-app .app-phone { right: 2%; width: clamp(245px, 19vw, 280px); }

/* Una sola superficie de producto dentro del marco perla existente. */
#solaria-app .app-phone { container-type: inline-size; }
#solaria-app .app-overview-ui {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
  height: 100%;
  padding: 43px 5cqw 18px !important;
  overflow: hidden;
  color: #182235 !important;
  background: #f6f9fc !important;
}
.app-overview-head { display: flex; align-items: center; gap: 6px; min-height: 35px; }
.app-overview-head .ai-presence { width: 24px; height: 24px; flex: none; }
.app-overview-head span { display: block; font-size: clamp(11px, 4.9cqw, 15px); font-weight: 800; line-height: 1; }
.app-overview-head small { display: block; margin-top: 4px; color: #718096; font-size: clamp(7px, 2.9cqw, 9px); font-weight: 500; }
.app-overview-head > b { margin-left: auto; color: #8794a6; font-size: 16px; font-weight: 400; }
.app-overview-welcome { display: grid; gap: 3px; margin: 14px 0 10px; }
.app-overview-welcome small { color: #667a99; font-size: clamp(7px, 2.8cqw, 9px); font-weight: 800; letter-spacing: .13em; }
.app-overview-welcome b { font-size: clamp(15px, 6.5cqw, 21px); letter-spacing: -.04em; line-height: 1.1; }
.app-overview-welcome span { color: #78869a; font-size: clamp(8px, 3.2cqw, 10px); }
.app-overview-metric { display: grid; gap: 5px; padding: 12px; border: 1px solid #e1eaf1; border-radius: 15px; background: #fff; box-shadow: 0 8px 20px #2b45700e; }
.app-overview-metric span { color: #697d98; font-size: clamp(7px, 2.9cqw, 9px); font-weight: 800; letter-spacing: .1em; }
.app-overview-metric strong { color: #17213b; font-size: clamp(24px, 11cqw, 35px); letter-spacing: -.06em; line-height: 1; }
.app-overview-metric em { color: #168b74; font-size: clamp(8px, 3.2cqw, 10px); font-style: normal; font-weight: 700; }
.app-overview-chart { display: flex; flex: 1; flex-direction: column; min-height: 82px; margin-top: 9px; padding: 10px 10px 0; overflow: hidden; border: 1px solid #e1eaf1; border-radius: 15px; background: #fff; }
.app-overview-chart > div { display: flex; justify-content: space-between; align-items: center; gap: 5px; }
.app-overview-chart span { color: #697d98; font-size: clamp(7px, 2.7cqw, 9px); font-weight: 800; letter-spacing: .1em; }
.app-overview-chart b { color: #677892; font-size: clamp(7px, 2.7cqw, 9px); font-weight: 500; }
.app-overview-chart svg { width: 100%; flex: 1; min-height: 55px; margin-top: 8px; }
.app-overview-chart .chart-fill { fill: #aee6fa6b; }
.app-overview-chart .chart-line { fill: none; stroke: #46b8d9; stroke-width: 3; stroke-linecap: round; }
.app-overview-insight { display: flex; align-items: flex-start; gap: 7px; margin-top: 9px; padding: 11px 9px; border: 1px solid #d9d5f3; border-radius: 15px; background: #f0edff; }
.app-overview-insight .ai-presence { width: 19px; height: 19px; flex: none; }
.app-overview-insight span { display: grid; gap: 5px; }
.app-overview-insight small { color: #6f5bb0; font-size: clamp(6px, 2.4cqw, 8px); font-weight: 800; letter-spacing: .06em; }
.app-overview-insight b { color: #30285d; font-size: clamp(9px, 3.5cqw, 12px); line-height: 1.3; }
.app-overview-insight em { color: #6954a8; font-size: clamp(7px, 2.9cqw, 9px); font-style: normal; font-weight: 700; }
.app-overview-tabs { display: flex; justify-content: space-around; align-items: center; flex: none; height: 43px; margin: 8px -5cqw -14px; border-top: 1px solid #e2e9ef; background: #fff; }
.app-overview-tabs span { display: grid; justify-items: center; gap: 1px; color: #8390a3; font-size: 16px; line-height: 1; }
.app-overview-tabs .is-current { color: #6371cc; }
.app-overview-tabs small { font-size: clamp(6px, 2.5cqw, 8px); }

@media (max-width: 760px) {
  .journey-nav { grid-template-columns: 43px minmax(0, 1fr) 0; gap: 5px; padding: 0 10px; }
  .scroll-hint { display: none; }
  .product-nav { mask-image: none; }
  .product-nav button { padding: 8px 10px; font-size: .55rem; }
  .agobio-frase { top: calc(var(--header-h) + 10px); }
  .agobio-pensamientos {
    inset: 0;
    display: block;
  }
  .agobio-pensamientos .pensamiento {
    position: absolute;
    top: var(--y);
    right: auto;
    left: auto;
    display: flex;
    max-width: min(39vw, 150px);
    min-height: 30px;
    padding: 6px 9px;
    border-radius: 13px;
    font-size: clamp(9px, 2.7vw, 11px);
    white-space: normal;
    line-height: 1.18;
    opacity: 1;
    animation: none;
    transform: translateY(-50%) rotate(var(--rot, 0deg));
  }
  .agobio-pensamientos .p-izq { left: var(--x); }
  .agobio-pensamientos .p-der { right: var(--x); }
  .agobio-pensamientos .pensamiento:nth-child(1) { top: max(26%, calc(var(--header-h) + 115px)); left: 5%; }
  .agobio-pensamientos .pensamiento:nth-child(2) { top: 29%; right: 3%; }
  .agobio-pensamientos .pensamiento:nth-child(3) { top: 37%; left: 12%; }
  .agobio-pensamientos .pensamiento:nth-child(4) { top: 42%; right: 1%; }
  .agobio-pensamientos .pensamiento:nth-child(5) { top: 51%; left: 1%; max-width: 30vw; }
  .agobio-pensamientos .pensamiento:nth-child(6) { top: 57%; right: 1%; max-width: 30vw; }
  .agobio-pensamientos .pensamiento:nth-child(7) { top: 70%; left: 3%; max-width: 30vw; }
  .agobio-pensamientos .pensamiento:nth-child(8) { top: 75%; right: 1%; max-width: 30vw; }
  .agobio-pensamientos .pensamiento:nth-child(n+5) { display: flex; }
  .agobio-pensamientos .pensamiento i { width: 15px; height: 15px; flex: none; font-size: 9px; }
  .agobio-pose { display: none; }
  .agobio-mobile-art {
    position: absolute;
    z-index: 1;
    bottom: calc(var(--footer-h) + 55px);
    left: 50%;
    display: block;
    width: min(87vw, 350px);
    height: auto;
    transform: translateX(-50%);
  }
  .agobio-next {
    position: absolute;
    z-index: 5;
    right: 18px;
    bottom: calc(var(--footer-h) + 10px);
    left: 18px;
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 3px 12px;
    align-items: center;
    min-height: 56px;
    padding: 9px 16px;
    border: 1px solid #ffffff99;
    border-radius: 18px;
    color: #fff;
    background: #1b2456e8;
    box-shadow: 0 10px 28px #17204d66;
    text-align: left;
    cursor: pointer;
  }
  .agobio-next span { grid-column: 1; color: #b8c3fb; font-size: 9px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
  .agobio-next strong { grid-column: 1; font-size: 13px; }
  .agobio-next i { grid-column: 2; grid-row: 1 / 3; font-size: 24px; font-style: normal; }
  .agobio-next:active { transform: scale(.98); }

  #solaria-app .app-stage { position: relative; display: block; width: 100%; height: 470px; min-height: 470px; margin-top: 12px; transform: none; }
  #solaria-app .app-laptop { position: absolute; top: 112px; right: 0; left: auto; display: block; width: min(72vw, 280px); transform: none; }
  #solaria-app .app-phone { position: absolute; z-index: 9; top: 6px; right: auto; bottom: auto; left: 2%; width: clamp(175px, 52vw, 205px); max-width: none; transform: rotate(-2deg); }
  .quote-layout { display: block; padding: calc(var(--header-h) + 35px) 22px calc(var(--footer-h) + 40px); }
  .quote-copy h2 { margin: 16px 0 22px; font-size: clamp(3.3rem, 13vw, 5rem); }
  .quote-lede { font-size: 1.1rem; }
  .quote-note { font-size: .86rem; }
  .quote-actions { display: grid; gap: 10px; margin: 26px 0 20px; }
  .quote-actions a { justify-content: center; text-align: center; }
  .quote-visual { min-height: 230px; margin-top: 18px; }
  .quote-visual > .ai-presence { width: 130px; height: 130px; }
  .quote-orbit { width: 220px; }
  .quote-orbit-two { width: 290px; }
  .quote-visual span { bottom: -8px; }
}

@media (min-width: 761px) and (max-width: 900px) {
  #solaria-app .app-stage { position: relative; display: block; width: min(100%, calc(100vw - 420px)); min-height: 420px; transform: none; }
  #solaria-app .app-laptop { position: absolute; top: 180px; right: 0; left: auto; display: block; width: min(34vw, 300px); transform: none; }
  #solaria-app .app-phone { position: absolute; top: 55px; right: auto; bottom: auto; left: 2%; width: min(25vw, 200px); transform: rotate(-2deg); }
}

@media (max-width: 360px), (max-height: 680px) and (max-width: 760px) {
  .agobio-pensamientos .pensamiento { min-height: 26px; padding: 4px 7px; font-size: 9px; }
  .agobio-mobile-art { width: min(87vw, 310px); bottom: calc(var(--footer-h) + 20px); }
  .agobio-next { min-height: 48px; }
  #solaria-app .app-stage { height: 370px; min-height: 370px; }
  #solaria-app .app-phone { width: min(48vw, 160px); }
  #solaria-app .app-laptop { top: 100px; width: min(70vw, 260px); }
}

@media (max-height: 700px) and (max-width: 760px) {
  #solaria-app .app-stage { height: 340px; min-height: 340px; }
  #solaria-app .app-phone { width: min(39vw, 145px); }
  #solaria-app .app-laptop { top: 85px; width: min(59vw, 220px); }
}

@media (max-height: 620px) and (max-width: 760px) {
  .agobio-mobile-art { width: min(76vw, 260px); }
  #solaria-app .app-phone { width: min(37vw, 135px); }
}

@media (prefers-reduced-motion: reduce) {
  .agobio-pensamientos .pensamiento { animation: none; }
  .agobio-next, .product-nav button { transition: none; }
}