/* Home V17 · iteración 2: hero del Conejo Blanco, los cinco agentes, otros servicios y páginas internas.
   Capa sobre v17-conejo.css (mismos tokens). Movimiento solo con html[data-motion="full"]; sin JS todo queda visible. */

/* ---------- Hero del conejo ---------- */
.v17h-hero{position:relative;min-height:560px;height:100vh;height:100svh;overflow:hidden;background:var(--fondo);isolation:isolate}
.v17h-hero__medio{position:absolute;left:50%;top:50%;width:max(100%,177.78vh);height:max(100%,56.25vw);transform:translate(-50%,-50%);z-index:0}
@supports (height:100svh){.v17h-hero__medio{width:max(100%,177.78svh)}}
.v17h-hero__puerta,.v17h-hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.v17h-hero__video{opacity:0;transition:opacity .5s var(--v17-ease)}
.v17h-hero__video.on{opacity:1}
.v17h-hero__sombra{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(3,8,7,.62) 0%,transparent 20%,transparent 46%,rgba(3,8,7,.84) 80%,rgba(3,8,7,.97) 100%),
             linear-gradient(90deg,rgba(3,8,7,.8),rgba(3,8,7,.45) 34%,transparent 52%)}
.v17h-hero__copy{position:absolute!important;left:0;right:0;bottom:max(56px,calc(env(safe-area-inset-bottom) + 40px));z-index:2}
.v17h-kicker{display:flex;align-items:center;gap:12px;font:500 10.5px/1.6 'JetBrains Mono',ui-monospace,monospace;letter-spacing:.24em;text-transform:uppercase;color:var(--tinta-2);margin:0}
.v17h-kicker i{display:inline-block;width:26px;height:1px;background:linear-gradient(90deg,var(--magenta-lit),var(--cian))}
.v17h-hero__titulo{font-weight:200!important;font-size:clamp(44px,4.3vw,68px);line-height:1.02;letter-spacing:-.05em;max-width:10.5ch;margin:18px 0 18px;
  color:var(--tinta);text-shadow:0 2px 40px rgba(0,0,0,.5)}
.v17h-hero__sub{font-size:clamp(17px,1.4vw,20px);line-height:1.5;color:var(--tinta-2);max-width:26ch;margin:0 0 30px}
.v17h-hero__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.v17h-wa{display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;border-radius:999px;
  padding:17px 28px 17px 22px;font:600 16px/1 'Plus Jakarta Sans',system-ui,sans-serif;letter-spacing:-.01em;color:#04140b;
  background:linear-gradient(180deg,#63f3a2,#25d366);box-shadow:0 18px 50px rgba(37,211,102,.28),inset 0 1px 0 rgba(255,255,255,.5),0 0 0 1px rgba(255,255,255,.12) inset;
  transition:transform .2s var(--v17-ease),box-shadow .2s var(--v17-ease)}
.v17h-wa svg{width:20px;height:20px;flex:none}
.v17h-entrar{display:inline-flex;align-items:center;gap:12px;text-decoration:none;border-radius:999px;padding:16px 26px;
  font:600 16px/1 'Plus Jakarta Sans',system-ui,sans-serif;color:var(--tinta);background:rgba(6,20,22,.55);border:1px solid rgba(143,243,255,.42);
  box-shadow:0 0 28px rgba(143,243,255,.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  transition:transform .2s var(--v17-ease),background-color .2s var(--v17-ease),box-shadow .2s var(--v17-ease)}
.v17h-entrar .arr{color:var(--cian)}
.v17h-wa:active,.v17h-entrar:active{transform:scale(.97)}
.v17h-wa:focus-visible,.v17h-entrar:focus-visible,.v17h-serv:focus-visible,.v17h-volver:focus-visible{outline:2px solid var(--cian);outline-offset:4px}
@media (hover:hover) and (pointer:fine){
  .v17h-wa:hover{transform:translateY(-2px);box-shadow:0 24px 60px rgba(37,211,102,.38),inset 0 1px 0 rgba(255,255,255,.5)}
  .v17h-entrar:hover{background-color:rgba(10,40,44,.75);box-shadow:0 0 40px rgba(143,243,255,.26)}
}

/* ---------- Los cinco agentes ---------- */
.v17h-agentes .rv-head{max-width:760px}
.v17h-ag-pista{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:18px;margin-top:44px}
.v17h-ag{grid-column:span 2;display:flex;flex-direction:column;gap:18px;padding:22px;border-radius:22px;
  background:linear-gradient(180deg,rgba(10,26,26,.55),rgba(4,11,11,.3));border:1px solid var(--borde-suave)}
.v17h-ag:nth-child(n+4){grid-column:span 3}
.v17h-ag__num{margin:0;font:500 10.5px/1 'JetBrains Mono',monospace;letter-spacing:.22em;color:var(--tinta-3)}
.v17h-ag__num b{color:var(--cian);font-weight:500}
.v17h-ag h3{margin:12px 0 8px;font-weight:200;font-size:clamp(28px,2.3vw,36px);line-height:1.02;letter-spacing:-.045em}
.v17h-ag__txt p:last-child{margin:0;font-size:15.5px;line-height:1.5;color:var(--tinta-2)}
.v17h-ag-pie{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:18px;margin-top:30px}
.v17h-nota{margin:0;font:400 10px/1 'JetBrains Mono',monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-3)}
.v17h-ag-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:22px}

/* Panel holográfico y mini demos (del recorrido /conejo/, con prefijo ag-) */
.ag-holo{position:relative;margin-top:4px;border-radius:18px;padding:16px 16px 18px;overflow:hidden;isolation:isolate;
  background:linear-gradient(165deg,rgba(18,48,48,.66),rgba(5,15,16,.84) 55%,rgba(10,10,22,.86));border:1px solid var(--borde);
  box-shadow:0 1px 0 rgba(255,255,255,.07) inset,0 30px 70px rgba(0,0,0,.5),0 0 60px rgba(80,240,255,.06)}
.ag-holo::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;background:repeating-linear-gradient(180deg,rgba(143,243,255,.035) 0 1px,transparent 1px 4px)}
.ag-holo::after{content:"";position:absolute;left:16px;right:16px;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--cian),var(--magenta-lit),transparent);opacity:.7}
.ag-cab{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:12px;margin-bottom:12px;border-bottom:1px solid rgba(143,243,255,.1);
  font:500 9.5px/1 'JetBrains Mono',monospace;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-3)}
.ag-vivo{display:flex;align-items:center;gap:7px;color:var(--verde);white-space:nowrap}
.ag-vivo i{width:6px;height:6px;border-radius:50%;background:var(--verde);box-shadow:0 0 10px var(--verde)}
html[data-motion="full"] .ag-vivo i{animation:agLate 2.2s ease-in-out infinite}
@keyframes agLate{50%{opacity:.35}}
.ag-chat{display:flex;flex-direction:column;gap:7px}
.ag-hora{align-self:center;margin:0;font:400 9.5px/1 'JetBrains Mono',monospace;letter-spacing:.14em;color:var(--tinta-3);padding:2px 0}
.ag-msg{max-width:84%;margin:0;padding:8px 12px;border-radius:14px;font-size:13px;line-height:1.4;color:var(--tinta)}
.ag-yo{align-self:flex-end;background:rgba(61,255,142,.14);border:1px solid rgba(93,255,168,.22);border-bottom-right-radius:4px;color:#e6fff0}
.ag-bot{align-self:flex-start;background:rgba(143,243,255,.07);border:1px solid rgba(143,243,255,.16);border-bottom-left-radius:4px}
.ag-sola{display:block;width:fit-content}
.ag-sola.ag-yo{margin-left:auto}
.ag-catalogo{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:2px 0}
.ag-prod{margin:0;border-radius:11px;overflow:hidden;background:rgba(255,255,255,.03);border:1px solid rgba(143,243,255,.12)}
.ag-prod img{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover}
.ag-prod figcaption{display:flex;flex-direction:column;gap:3px;padding:6px 7px 7px;font-size:10.5px;line-height:1.2;color:var(--tinta-2)}
.ag-prod figcaption b{font:500 10px/1 'JetBrains Mono',monospace;color:var(--tinta)}
.ag-semana{display:grid;grid-template-columns:38px repeat(5,1fr);gap:5px;margin:12px 0;align-items:center}
.ag-semana b{font:500 9px/1 'JetBrains Mono',monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--tinta-3);text-align:center;padding-bottom:3px}
.ag-semana em{font:400 9px/1 'JetBrains Mono',monospace;color:var(--tinta-3);font-style:normal}
.ag-semana i{position:relative;height:28px;border-radius:7px;border:1px solid rgba(143,243,255,.1);background:rgba(255,255,255,.015)}
.ag-semana i.ocu{background:rgba(143,243,255,.07);border-color:rgba(143,243,255,.14)}
.ag-semana i.nueva{background:linear-gradient(180deg,rgba(61,255,142,.32),rgba(61,255,142,.14));border-color:rgba(93,255,168,.6);box-shadow:0 0 18px rgba(61,255,142,.25)}
.ag-semana i.nueva::after{content:attr(data-nombre);position:absolute;inset:0;display:grid;place-items:center;font-size:8px;font-weight:600;color:#dfffee;font-style:normal}
.ag-ticket{display:flex;flex-direction:column;gap:8px}
.ag-ticket-num{display:flex;justify-content:space-between;margin:0;font:500 10px/1 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-3)}
.ag-ticket-num b{color:var(--cian);font-weight:500}
.ag-ticket-num small,.ag-resumen-t small{font:400 9px/1 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#ff8fae}
.ag-linea,.ag-total,.ag-dato{display:flex;justify-content:space-between;gap:12px;margin:0;font-size:13px;color:var(--tinta)}
.ag-linea{padding:9px 11px;border-radius:10px;background:rgba(255,255,255,.025);border:1px solid rgba(143,243,255,.09)}
.ag-linea b,.ag-total b,.ag-dato b{font:500 12.5px/1.4 'JetBrains Mono',monospace;color:var(--tinta);white-space:nowrap}
.ag-suave{color:var(--tinta-2)}
.ag-total{padding:10px 2px 2px;border-top:1px dashed rgba(143,243,255,.2);font-weight:500}
.ag-total b{font-size:16px;color:var(--verde)}
.ag-pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:2px}
.ag-pasos span{padding:8px 4px;border-radius:8px;text-align:center;font:500 8.5px/1.2 'JetBrains Mono',monospace;letter-spacing:.08em;text-transform:uppercase;
  color:#cfffe4;background:rgba(61,255,142,.12);border:1px solid rgba(93,255,168,.35)}
.ag-tiempo{list-style:none;position:relative;margin:0;padding:4px 0 2px 26px;display:flex;flex-direction:column;gap:16px}
.ag-tiempo::before{content:"";position:absolute;left:6px;top:10px;bottom:12px;width:1px;background:linear-gradient(180deg,rgba(143,243,255,.4),rgba(93,255,168,.6))}
.ag-tiempo li{position:relative;font-size:13.5px;line-height:1.45;color:var(--tinta)}
.ag-tiempo li::before{content:"";position:absolute;left:-25px;top:5px;width:11px;height:11px;border-radius:50%;border:1px solid var(--cian);background:var(--fondo)}
.ag-tiempo li.ag-cierre{color:#dfffee}
.ag-tiempo li.ag-cierre::before{background:var(--verde);border-color:var(--verde);box-shadow:0 0 14px var(--verde)}
.ag-tiempo small{display:block;margin-bottom:4px;font:400 9.5px/1 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta-3)}
.ag-resumen{display:flex;flex-direction:column;gap:0}
.ag-resumen-t{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 6px;font-weight:500;font-size:15px;color:var(--tinta)}
.ag-dato{padding:9px 0;border-bottom:1px solid rgba(143,243,255,.08);color:var(--tinta-2)}
.ag-dato b{font-size:15px}
.ag-texto b{font:500 12.5px/1.4 'Plus Jakarta Sans',sans-serif;color:var(--cian);white-space:normal;text-align:right}

/* Entrada de las demos: cada paso aparece en su turno (--i); sin movimiento, el estado final */
html[data-motion="full"] .v17h-r .ag-p{opacity:0;transform:translateY(8px)}
html[data-motion="full"] .v17h-r.v17h-on .ag-p{opacity:1;transform:none;
  transition:opacity .45s var(--v17-ease),transform .5s var(--v17-ease);transition-delay:calc(var(--i,0) * .32s + .25s)}
html[data-motion="full"] .v17h-serv.v17h-r{opacity:0;transform:translateY(14px)}
html[data-motion="full"] .v17h-serv.v17h-r.v17h-on{opacity:1;transform:none;transition:opacity .5s var(--v17-ease),transform .5s var(--v17-ease)}
html[data-motion="full"] .v17h-serv.v17h-r.v17h-on:nth-child(2){transition-delay:.08s}
html[data-motion="full"] .v17h-serv.v17h-r.v17h-on:nth-child(3){transition-delay:.16s}
html[data-motion="full"] .v17h-serv.v17h-r.v17h-on:nth-child(4){transition-delay:.24s}
.motion-paused .v17h-r .ag-p,.motion-paused .v17h-serv.v17h-r{opacity:1!important;transform:none!important;transition:none!important}

/* ---------- Otros servicios ---------- */
.v17h-otros__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:44px 0 22px}
.v17h-serv{position:relative;display:flex;flex-direction:column;gap:10px;min-height:230px;padding:24px 22px 22px;border-radius:20px;text-decoration:none;color:var(--tinta);
  background:linear-gradient(165deg,rgba(14,36,36,.55),rgba(4,11,11,.5));border:1px solid var(--borde-suave);overflow:hidden;
  transition:border-color .25s var(--v17-ease),background-color .25s var(--v17-ease),transform .25s var(--v17-ease)}
.v17h-serv::after{content:"";position:absolute;left:22px;right:22px;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(143,243,255,.55),rgba(232,69,110,.4),transparent)}
.v17h-serv__num{font:500 10px/1 'JetBrains Mono',monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-3)}
.v17h-serv b{font-weight:200;font-size:clamp(23px,1.9vw,28px);line-height:1.08;letter-spacing:-.04em;margin-top:6px}
.v17h-serv small{font-size:15px;line-height:1.5;color:var(--tinta-2)}
.v17h-serv em{margin-top:auto;font:500 11px/1 'JetBrains Mono',monospace;font-style:normal;letter-spacing:.18em;text-transform:uppercase;color:var(--verde)}
.v17h-serv--precio{border-color:rgba(93,255,168,.32);background:linear-gradient(165deg,rgba(14,44,32,.55),rgba(4,11,11,.5))}
@media (hover:hover) and (pointer:fine){.v17h-serv:hover{border-color:rgba(143,243,255,.4);transform:translateY(-3px)}}
.v17h-otros .duo-secondary{margin-top:0;border-top:0!important}

/* ---------- Páginas internas ---------- */
.v17h-sub{display:block;padding-top:96px}
.v17h-migas{display:flex!important;align-items:center;gap:12px;padding-top:26px!important;padding-bottom:0!important;
  font:500 10.5px/1 'JetBrains Mono',monospace;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-3)}
.v17h-migas a{color:var(--cian);text-decoration:none}
.v17h-migas a:hover{text-decoration:underline}
.v17h-sub > .hero{margin-top:-96px}
.v17h-cierre{border-top:1px solid var(--borde-suave)}
.v17h-cierre__in{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.v17h-cierre h2{margin:0;font-weight:200!important;font-size:clamp(40px,5vw,72px);line-height:1;letter-spacing:-.05em}
.v17h-cierre__ctas{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:8px}
.v17h-wa--chico{padding:14px 22px;font-size:15px;gap:12px}
.v17h-wa--chico span+span{font:500 13px/1 'JetBrains Mono',monospace;letter-spacing:.02em}
.v17h-volver{margin-top:10px;font:400 10.5px/1 'JetBrains Mono',monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--tinta-3);text-decoration:none}
.v17h-volver:hover{color:var(--tinta)}

/* ---------- Celular y tableta ---------- */
@media (max-width:1100px){
  .v17h-ag-pista{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v17h-ag,.v17h-ag:nth-child(n+4){grid-column:span 1}
  .v17h-ag:last-child{grid-column:1 / -1}
  .v17h-otros__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:740px){
  .v17h-hero{min-height:600px}
  .v17h-hero__sombra{background:linear-gradient(180deg,rgba(3,8,7,.6) 0%,transparent 16%,transparent 36%,rgba(3,8,7,.86) 62%,rgba(3,8,7,.97) 100%)}
  .v17h-hero__copy{bottom:max(28px,calc(env(safe-area-inset-bottom) + 20px))}
  .v17h-kicker{gap:8px;font-size:9.5px;letter-spacing:.2em}
  .v17h-hero__titulo{font-size:clamp(40px,11.6vw,54px);margin:14px 0 14px}
  .v17h-hero__sub{font-size:16px;margin-bottom:22px}
  .v17h-hero__ctas{flex-direction:column;align-items:stretch;gap:10px}
  .v17h-wa,.v17h-entrar{justify-content:center;padding-top:16px;padding-bottom:16px}
  /* agentes: carrusel con borde que asoma la siguiente tarjeta */
  .v17h-ag-pista{display:flex;align-items:flex-start;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:34px -22px 0;padding:0 22px 6px;scrollbar-width:none;overscroll-behavior-x:contain}
  .v17h-ag-pista::-webkit-scrollbar{display:none}
  .v17h-ag,.v17h-ag:nth-child(n+4),.v17h-ag:last-child{flex:0 0 84%;scroll-snap-align:center;padding:18px;gap:14px}
  .v17h-ag h3{font-size:30px}
  .v17h-ag-pie{flex-direction:column;align-items:flex-start;margin-top:22px}
  .v17h-ag-ctas{flex-direction:column-reverse;align-items:stretch;width:100%;gap:16px}
  .v17h-ag-ctas .cta-pill{justify-content:center}
  .v17h-otros__grid{grid-template-columns:1fr 1fr;gap:10px;margin-top:34px}
  .v17h-serv{min-height:0;padding:18px 16px;gap:8px;border-radius:16px}
  .v17h-serv b{font-size:20px}
  .v17h-serv small{font-size:13.5px}
  .v17h-serv em{margin-top:6px;font-size:10px;letter-spacing:.14em}
  .v17h-sub{padding-top:78px}
  .v17h-sub > .hero{margin-top:-78px}
  .v17h-cierre__ctas{flex-direction:column;align-items:stretch;width:100%}
  .v17h-cierre__ctas .cta-pill{justify-content:center}
}
@media (max-width:380px){.v17h-otros__grid{grid-template-columns:1fr}}
@media (prefers-reduced-motion:reduce){html:not([data-motion="full"]) .ag-vivo i{animation:none}}

/* Menú con «Agentes»: un poco más compacto en escritorio para que entre sin chocar */
@media (min-width:1001px){.nav-links{gap:clamp(14px,1.45vw,24px)!important}.nav-links a{font-size:14px}}
@media (min-width:1001px) and (max-width:1240px){.nav-links{gap:12px!important}.nav-links a{font-size:13px}}
/* El botón flotante no tapa los botones del hero */
.v17h-sin-flotante .wa-float,.v17h-sin-flotante .wa-tip{opacity:0;pointer-events:none;transition:opacity .3s}
.wa-float,.wa-tip{transition:opacity .3s}
@media (max-width:740px){
  /* celular: el cuadro del pasillo a 200 % del ancho, arriba, para que se vea la puerta entera y no una pared cian */
  .v17h-hero__medio{top:calc(64px + 2svh);width:200vw;height:112.5vw;transform:translateX(-50%)}
  .v17h-hero{background:radial-gradient(ellipse 90% 40% at 50% 30%,rgba(60,170,180,.18),transparent 70%),var(--fondo)}
  .v17h-hero__sombra{background:linear-gradient(180deg,rgba(3,8,7,.7) 0%,transparent 12%,transparent 30%,rgba(3,8,7,.82) 52%,rgba(3,8,7,.97) 64%,var(--fondo) 100%)}
}
