/* TuTallerYa v10.33 — Descarga con iPhone + Samsung, dos modelos 3D reales.
   Solo afecta #descargar-app y la frontera inferior del recorrido anterior. */
.editorial-page .tty-journey { border-bottom: 0 !important; }
.editorial-page .tty-journey .j-visual-note { border-top: 0 !important; }
.editorial-page .tty-journey .j-progress { display: none !important; }

.editorial-page .j-download.d-download {
  --d-ink: #101e3c;
  --d-secondary: #596b84;
  --d-link: #155dfd;
  --d-accent: #ff6316;
  --d-card: rgba(255,255,255,.79);
  --d-outline: rgba(67,105,161,.20);
  box-sizing: border-box;
  isolation: isolate;
  position: relative;
  width: 100%;
  max-width: none;
  margin: -1px 0 0;
  border: 0;
  padding: clamp(65px,8vw,132px) 0 clamp(70px,8vw,125px);
  min-height: 750px;
  background: radial-gradient(ellipse at 16% 45%,rgba(21,93,253,.11),transparent 43%),
              radial-gradient(ellipse at 34% 80%,rgba(255,99,22,.08),transparent 39%),
              linear-gradient(180deg,var(--background) 0%,#f5f8ff 72%,var(--background) 100%);
  color: var(--d-ink);
  overflow: hidden;
}
:root[data-theme='dark'] .editorial-page .j-download.d-download {
  --d-ink:#edf4ff;
  --d-secondary:#a6b7d1;
  --d-link:#7baaff;
  --d-card: rgba(12,31,66,.76);
  --d-outline: rgba(105,150,231,.29);
  background:radial-gradient(ellipse at 24% 39%,rgba(21,93,253,.13),transparent 45%),
             radial-gradient(ellipse at 35% 76%,rgba(255,99,22,.07),transparent 38%),
             linear-gradient(180deg,var(--background) 0%,#091831 75%,var(--background) 100%);
}
.editorial-page .j-download.d-download::before {
  content:'';
  position:absolute;
  z-index:-1;
  pointer-events:none;
  width:min(72vw,1100px);
  height:min(72vw,1100px);
  left:-14%;
  top:-28%;
  border-radius:50%;
  border:1px solid rgba(21,93,253,.10);
  box-shadow:0 0 0 80px rgba(21,93,253,.018),0 0 0 190px rgba(21,93,253,.012);
  transform:rotate(-18deg) scaleX(1.25);
}
.editorial-page .j-download.d-download .d-download-inner {
  display:grid;
  grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);
  gap:clamp(12px,4vw,65px);
  align-items:center;
  width:min(1450px,calc(100% - 8vw));
  max-width:none;
  padding:0;
  min-width:0;
  position:relative;
  z-index:1;
}

/* Phones: the existing source CSS geometry is the fallback and the existing
   TuTallerYa WebGL model replaces it once textures are ready. */
.d-download .d-phones {
  position:relative;
  min-width:0;
  width:100%;
  height:clamp(575px,71svh,730px);
  isolation:isolate;
  perspective:1500px;
}
.d-download .d-phone-stage {
  position:absolute;
  top:0;
  z-index:3;
  width:55%;
  height:97%;
  opacity:0;
  transition:opacity .9s ease, translate 1.25s cubic-bezier(.15,.8,.15,1);
  contain:layout style;
  pointer-events:none;
}
.d-download .d-phone-stage--iphone {
  left:0;
  top:5.5%;
  z-index:4;
  --j-phone-h:clamp(400px,58svh,575px);
  translate:-42px 24px;
}
.d-download .d-phone-stage--samsung {
  right:-1%;
  top:-1.3%;
  z-index:3;
  --j-phone-h:clamp(390px,55svh,540px);
  translate:48px 38px;
}
.d-download.d-in-view .d-phone-stage{opacity:1;translate:0 0;}
.d-download .d-phone-stage .j-scene {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  perspective:1500px;
  perspective-origin:50% 52%;
  transform:none;
  z-index:3;
}
.d-download .d-phone-stage .j-carrier {
  top:50%;
  left:50%;
  --j-half-depth:calc(var(--j-phone-h)*.0225);
  height:var(--j-phone-h);
  width:calc(var(--j-phone-h)*.482);
}
.d-download .d-phone-stage .j-phone {
  transform-style:preserve-3d;
  transform:rotateY(0deg) rotateX(-3deg);
}
.d-download .d-phone-stage .j-screen img { object-fit:cover; opacity:1; }
.d-download .d-phone-stage .d-phone-shadow {
  position:absolute;
  z-index:1;
  left:6%;right:6%;bottom:7%;
  height:24px;
  border-radius:50%;
  transform:scaleX(.88);
  background:radial-gradient(ellipse,rgba(21,93,253,.35),transparent 72%);
  filter:blur(9px);
}
.d-download .d-phone-stage--samsung .d-phone-shadow {
  background:radial-gradient(ellipse,rgba(255,99,22,.33),transparent 72%);
  bottom:9%;
}
:root:not([data-theme='dark']) .d-download .d-phone-shadow { opacity:.35; }
.d-download .d-phone-stage .j-phone-canvas {position:absolute;inset:0;}
.d-download .d-orbit-ring {
  position:absolute;
  left:6%;
  top:32%;
  width:89%;
  height:38%;
  border-radius:50%;
  transform:rotate(-25deg);
  opacity:.60;
  pointer-events:none;
  z-index:1;
}
.d-download .d-orbit-ring--blue {
  border:1px solid rgba(21,93,253,.32);
  box-shadow:0 0 15px rgba(21,93,253,.12),inset 0 0 22px rgba(21,93,253,.05);
}
.d-download .d-orbit-ring--orange {
  left:10%;top:37%;width:78%;height:28%;
  transform:rotate(27deg);
  border:1px solid rgba(255,99,22,.22);
  box-shadow:0 0 12px rgba(255,99,22,.09);
}
.d-download .d-phones-accent {
  position:absolute;
  left:11%;bottom:6%;width:80%;height:19%;
  z-index:1;
  border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(21,93,253,.17),rgba(255,99,22,.07) 43%,transparent 71%);
  filter:blur(20px);
  opacity:.67;
  pointer-events:none;
}
.d-download .d-orbit-ring{animation:d-orbit 29s ease-in-out infinite alternate;}
.d-download .d-orbit-ring--orange{animation-duration:35s;animation-direction:alternate-reverse;}
@keyframes d-orbit {from{rotate:-9deg;opacity:.24;}to{rotate:11deg;opacity:.76;}}

/* Copy and live store links. */
.d-download .d-download-copy {
  width:100%;
  max-width:610px;
  min-width:0;
  position:relative;
  z-index:6;
  opacity:0;
  translate:0 35px;
  transition:opacity .95s ease .18s,translate 1s cubic-bezier(.15,.8,.15,1) .18s;
}
.d-download.d-in-view .d-download-copy{opacity:1;translate:0 0;}
.d-download .d-eyebrow{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin:0 0 20px;
  font-size:10px;
  font-weight:750;
  letter-spacing:.16em;
  color:var(--d-link);
}
.d-download .d-eyebrow span{height:4px;width:4px;border-radius:50%;background:#ff6316;}
.d-download #download-title{
  font-size:clamp(45px,4.8vw,79px);
  line-height:1.055;
  letter-spacing:-.065em;
  font-weight:760;
  color:var(--d-ink);
  max-width:700px;
  margin:0;
  text-wrap:balance;
}
.d-download #download-title span {
  background:linear-gradient(95deg,#155dfd 1%,#7978f1 53%,#ff6316 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
:root[data-theme='dark'] .d-download #download-title span{
  background-image:linear-gradient(95deg,#78a8ff 2%,#afa3ff 47%,#ff9c64 100%);
}
.d-download .d-download-lead {
  margin:24px 0 0;
  font-size:clamp(14px,1.1vw,18px);
  line-height:1.75;
  color:var(--d-secondary);
  max-width:525px;
}
.d-download .j-store-links.d-store-links {
  margin:32px 0 0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  max-width:570px;
  gap:12px;
  width:100%;
}
.d-download .j-store-links.d-store-links a {
  position:relative;
  isolation:isolate;
  display:flex;
  flex:1;
  min-width:0;
  gap:14px;
  min-height:78px;
  padding:16px 18px;
  border-radius:17px;
  border:1px solid var(--d-outline);
  background:var(--d-card);
  color:var(--d-ink);
  box-shadow:0 12px 34px rgba(21,93,253,.055),inset 0 1px 0 rgba(255,255,255,.1);
  backdrop-filter:blur(15px);
  -webkit-backdrop-filter:blur(15px);
  text-decoration:none;
  overflow:hidden;
  transition:transform .26s ease,border-color .26s ease,box-shadow .26s ease;
}
.d-download .j-store-links.d-store-links a::before {
  content:'';position:absolute;inset:0;
  background:radial-gradient(circle at 10% -10%,rgba(21,93,253,.16),transparent 65%);
  opacity:0;transition:opacity .26s ease;z-index:-1;
}
.d-download .j-store-links.d-store-links a:nth-child(2)::before{background:radial-gradient(circle at 10% -10%,rgba(255,99,22,.12),transparent 65%);}
.d-download .j-store-links.d-store-links a:hover,
.d-download .j-store-links.d-store-links a:focus-visible {
  transform:translateY(-4px);
  border-color:rgba(21,93,253,.62);
  box-shadow:0 22px 50px rgba(21,93,253,.12),0 0 0 3px rgba(21,93,253,.06);
  outline:0;
}
.d-download .j-store-links.d-store-links a:nth-child(2):hover,
.d-download .j-store-links.d-store-links a:nth-child(2):focus-visible{
  border-color:rgba(255,99,22,.57);
  box-shadow:0 22px 50px rgba(255,99,22,.09),0 0 0 3px rgba(255,99,22,.06);
}
.d-download .j-store-links.d-store-links a:hover::before,
.d-download .j-store-links.d-store-links a:focus-visible::before{opacity:1;}
.d-download .j-store-links.d-store-links a img {width:29px;height:32px;object-fit:contain;flex:none;}
:root[data-theme='dark'] .d-download .j-store-links.d-store-links a img {filter:brightness(0) invert(1);}
.d-download .j-store-links.d-store-links strong {font-size:19px;letter-spacing:-.025em;}
.d-download .j-store-links.d-store-links small {font-size:10px;color:var(--d-secondary);}
.d-download .j-store-links.d-store-links a .d-store-arrow {margin-left:auto;font-size:17px;color:var(--d-link);}
.d-download .d-download-note {font-size:11px;line-height:1.65;margin:14px 0 0;max-width:510px;color:var(--d-secondary);}
.d-download .d-download-points {
  display:flex;flex-wrap:wrap;align-items:center;
  gap:12px 20px;
  margin-top:34px;
  color:var(--d-secondary);
}
.d-download .d-download-points span{font-size:11px;line-height:1.4;display:inline-flex;gap:7px;align-items:center;white-space:nowrap;}
.d-download .d-download-points .icon{width:15px;height:15px;color:var(--d-link);flex:none;}
.d-download .d-download-points span:last-child .icon{color:var(--d-accent);}

@media(max-width:1200px) and (min-width:801px){
  .editorial-page .j-download.d-download .d-download-inner{width:calc(100% - 6vw);gap:18px;}
  .d-download .d-phones{height:590px;}
  .d-download .d-phone-stage--iphone{--j-phone-h:clamp(380px,45vw,490px);}
  .d-download .d-phone-stage--samsung{--j-phone-h:clamp(365px,42vw,465px);}
  .d-download #download-title{font-size:clamp(39px,4.6vw,61px);}
  .d-download .d-download-points{margin-top:24px;}
}
@media(max-width:800px){
  .editorial-page .j-download.d-download{padding:68px 0 80px;min-height:0;}
  .editorial-page .j-download.d-download .d-download-inner {
    display:flex;flex-direction:column;gap:4px;
    width:calc(100% - 36px);
  }
  .d-download .d-phones{width:min(570px,100%);height:clamp(420px,76vw,555px);order:1;}
  .d-download .d-download-copy{order:2;max-width:570px;padding-top:6px;}
  .d-download .d-phone-stage--iphone{--j-phone-h:clamp(295px,54vw,445px);left:-1%;top:6%;width:55%;height:92%;}
  .d-download .d-phone-stage--samsung{--j-phone-h:clamp(290px,51vw,430px);right:-2%;top:-1%;width:56%;height:94%;}
  .d-download #download-title{font-size:clamp(39px,8vw,59px);}
  .d-download .d-download-lead{font-size:14px;max-width:none;}
  .d-download .d-download-points{margin-top:26px;}
}
@media(max-width:470px){
  .editorial-page .j-download.d-download {padding-block:50px 70px;}
  .d-download .d-phones{height:400px;}
  .d-download .d-phone-stage--iphone{--j-phone-h:330px;left:-2%;top:4%;width:56%;height:95%;}
  .d-download .d-phone-stage--samsung{--j-phone-h:315px;right:-2%;top:0;width:56%;height:92%;}
  .d-download .d-eyebrow{font-size:9px;letter-spacing:.12em;gap:7px;margin-bottom:13px;}
  .d-download #download-title{font-size:clamp(36px,9vw,47px);}
  .d-download .d-download-lead{font-size:13px;margin-top:17px;line-height:1.65;}
  .d-download .j-store-links.d-store-links{gap:9px;margin-top:23px;}
  .d-download .j-store-links.d-store-links a{padding:12px 9px;min-height:65px;gap:7px;border-radius:13px;}
  .d-download .j-store-links.d-store-links a img{width:23px;height:24px;}
  .d-download .j-store-links.d-store-links strong{font-size:15px;}
  .d-download .j-store-links.d-store-links small{font-size:8px;}
  .d-download .j-store-links.d-store-links .d-store-arrow{font-size:13px;}
  .d-download .d-download-note{font-size:10px;}
  .d-download .d-download-points{gap:10px 16px;}
  .d-download .d-download-points span{font-size:10px;}
}
@media(prefers-reduced-motion:reduce){
  .d-download .d-phone-stage,.d-download .d-download-copy{opacity:1;translate:0 0;transition:none!important;}
  .d-download .d-orbit-ring{animation:none!important;opacity:.35;}
  .d-download .j-store-links.d-store-links a{transition:none!important;}
}

/* v10.34 — Pantallas siempre mirando al visitante. El protagonismo cambia
   con movimientos de escala, lateralidad y profundidad, no con vueltas de 360°. */
.d-download .d-phone-stage {
  will-change:transform,opacity;
  transition:opacity .72s ease,translate .9s cubic-bezier(.2,.8,.2,1);
}
.d-download.d-in-view .d-phone-stage{translate:0 0;}
.d-download .d-orbit-ring{animation-duration:36s;opacity:.36;}
.d-download .d-phones-accent{opacity:.38;}
.d-download.d-is-handoff .d-phone-stage{transition:none!important;}
.d-download .d-phone-stage .j-phone{backface-visibility:hidden;}
.d-download .d-phone-stage .j-back{visibility:hidden;}

/* Los dos cuerpos temporales conectan físicamente el recorrido y Descargas.
   Son copias de las pantallas auténticas, sin interferir con clics o foco. */
.d-handoff-portal {
  position:fixed;
  inset:0;
  z-index:9999;
  overflow:visible;
  pointer-events:none;
  contain:layout style;
  perspective:1600px;
}
.d-handoff-portal[hidden]{display:none!important;}
.d-bridge-phone {
  position:absolute;
  left:0;top:0;
  transform-origin:center center;
  transform-style:preserve-3d;
  will-change:transform,opacity;
  pointer-events:none;
  filter:drop-shadow(0 15px 20px rgba(21,93,253,.12));
}
.d-bridge-phone {--j-half-depth:calc(var(--j-phone-h)*.0225);}
.d-bridge-phone .j-phone{width:100%;height:100%;transform-style:preserve-3d;}
.d-bridge-phone .j-back {visibility:hidden;}
.d-bridge-phone .j-screen img{object-fit:cover;}
@media(prefers-reduced-motion:reduce){
  .d-download .d-phone-stage{transition:none!important;}
  .d-download .d-orbit-ring{animation:none!important;}
  .d-handoff-portal{display:none!important;}
}
.d-download:not(.d-in-view) .d-orbit-ring{animation-play-state:paused;}

/* v10.36 — Un teléfono desciende; el segundo permanece oculto hasta llegar.
   Alternancia pausada de planos (5 segundos), sin órbita visual intensa. */
.d-download:not(.d-pair-ready) .d-phone-stage.d-secondary-device {
  opacity:0 !important;
  visibility:hidden !important;
  pointer-events:none !important;
}
.d-download.d-pair-ready .d-phone-stage.d-secondary-device {
  visibility:visible;
  opacity:1;
}
.d-download .d-phone-stage {
  transition:opacity .8s ease,translate .85s cubic-bezier(.22,.8,.22,1);
}
@media(prefers-reduced-motion:reduce) {
  .d-download.d-pair-ready .d-phone-stage.d-secondary-device {opacity:1;}
}


/* v10.38 — el movimiento lo anima el compositor, sin filtros dinámicos. */
.d-download .d-phone-stage,
.d-download .d-phone-stage .j-scene {
  will-change: transform;
  backface-visibility: hidden;
}
.d-download .d-phone-stage .j-scene {
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
}
.d-download .d-phone-stage .d-phone-shadow {will-change: opacity;}
@media (prefers-reduced-motion: reduce) {
  .d-download .d-phone-stage,
  .d-download .d-phone-stage .j-scene,
  .d-download .d-phone-stage .d-phone-shadow {will-change: auto;}
}

/* v10.38 — puente reverso por compositor, sin cambiar width/height. */
.d-handoff-portal .d-bridge-phone { transform-origin:0 0; filter:none; }
.tty-journey.d-bridge-active .j-visual {will-change:opacity;}


/* v10.39 — phones stay hidden until their initial orbit pose is measured.
   Prevents a temporary phone at the top during startup and WebGL warm-up. */
.d-download:not(.d-layout-ready) .d-phone-stage {
  opacity:0 !important;
  visibility:hidden !important;
}
.d-download .d-phone-stage .j-scene {transform:none;}
.d-download .d-phone-stage .j-phone {transform:rotateX(0deg) rotateY(0deg);}

/* La escena sticky nunca asoma con coordenadas de arranque sin calcular. */
.editorial-page .tty-journey.is-ready:not(.j-initialized) .j-visual {
  visibility: hidden;
}

/* v10.41 — full-viewport WebGL handoff: one 3D mesh, two real materials.
   Keep canvas visible only while the transfer is underway. */
.d-handoff-portal {perspective:none;overflow:hidden;}
.d-handoff-portal.d-portal-idle {visibility:hidden!important;opacity:0!important;}
.d-handoff-portal .d-bridge-stage {
  position:absolute;inset:0;left:0;top:0;width:100%;height:100%;
  transform:none!important;filter:none!important;contain:layout style;
  transform-origin:center;pointer-events:none;
}
.d-handoff-portal .d-bridge-stage .j-scene {
  position:absolute;inset:0;perspective:1700px;perspective-origin:50% 50%;
}
.d-handoff-portal .d-bridge-stage .j-carrier {
  position:absolute;left:50%;top:50%;height:var(--j-phone-h);
  width:calc(var(--j-phone-h)*.482);
}
.d-handoff-portal .d-bridge-stage .j-back {visibility:visible;}
.d-handoff-portal .d-bridge-stage .j-phone-canvas {
  width:100%;height:100%;display:none;
}
.d-handoff-portal .d-bridge-stage.has-webgl-phone .j-phone-canvas{display:block;}
.d-handoff-portal .d-bridge-stage.has-webgl-phone .j-carrier{visibility:hidden;}
