/* Avantia · landings de servicio (/servicios/…) y casos (/casos).
   Va DESPUÉS de avantia.css + pulido.css + tema.css: reutiliza su barra, pie, botones, «qh», «proceso2» y
   el fondo 3D (espacio.js). Aquí sólo lo propio de estas páginas, con su versión clara al final. */

/* ---------- palabras destacadas: la misma estela que la portada ---------- */
.sv-hero h1 em,.sv-pagina .cabeza h2 em,.sv-faq-cab h2 em,.sv-cierre h2 em,.sv-escena h3 em,.cs-cab h2 em,.sv-form-izq h2 em,.gr-hero h1 em{
  font:inherit;font-style:normal;letter-spacing:inherit;
  background:linear-gradient(100deg,#c9b8ff 0%,#9d7bff 30%,#6b2bff 55%,#b49cff 75%,#e9e2ff 85%,#8f63ff 100%) 0 0/250% 100%;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgb(124 77 255 / .35));animation:estela 7s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.sv-hero h1 em,.sv-pagina .cabeza h2 em,.sv-faq-cab h2 em,.sv-cierre h2 em,.cs-cab h2 em,.sv-form-izq h2 em,.gr-hero h1 em{animation:none}}

/* ---------- 1 · portada del servicio ---------- */
.sv-hero{min-height:min(100svh,860px);padding:140px 0 56px}
.sv-hero .cinta::after{background:linear-gradient(90deg,#000 30%,rgb(0 0 0 / .6) 55%,rgb(0 0 0 / .25) 80%),linear-gradient(0deg,#000 0,transparent 30%)}
.sv-hero-rej{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(24px,4vw,64px);align-items:center}
.sv-hero h1{font-size:clamp(40px,5vw,84px);line-height:1;letter-spacing:-.05em;max-width:14ch;margin:22px 0 26px}
.sv-h1-nombre{display:flex;width:fit-content;max-width:100%;margin-bottom:22px;font:500 12px/1.4 var(--mono);letter-spacing:.14em;text-wrap:balance}
.sv-hero-indice h1{font-size:clamp(46px,6.2vw,104px);max-width:12ch}
.sv-hero .hero-lema{max-width:36rem}
.sv-miga{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font:500 12px/1.4 var(--mono);letter-spacing:.08em;color:#8a8a93;margin-bottom:26px}
.sv-miga a{color:#bdbcc6}.sv-miga a:hover{color:#fff}
.sv-miga [aria-current]{color:#d9d6e6}
.sv-datos{display:flex;flex-wrap:wrap;gap:14px 34px;margin:46px 0 0;padding-top:22px;border-top:1px solid rgb(255 255 255 / .1);max-width:40rem}
.sv-datos div{display:grid;gap:6px}
.sv-datos dt{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:#8a8a93}
.sv-datos dd{margin:0;font:600 15px/1.3 var(--titular);color:#f3f2f7}

/* el objeto de cristal: flota, se inclina hacia el puntero (servicio.js pone --rx/--ry) y brilla */
.sv-obj{position:relative;aspect-ratio:1;width:min(100%,560px);justify-self:center;perspective:1100px}
.sv-obj-halo{position:absolute;inset:8%;border-radius:50%;background:radial-gradient(closest-side,rgb(124 77 255 / .45),rgb(107 43 255 / .12) 55%,transparent);filter:blur(10px);
  animation:sv-respira 6s ease-in-out infinite}
.sv-obj-giro{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.sv-obj-giro img{width:100%;height:100%;object-fit:contain;animation:sv-flota 7s ease-in-out infinite;
  filter:drop-shadow(0 30px 50px rgb(60 20 160 / .45)) drop-shadow(0 0 30px rgb(124 77 255 / .25))}
.sv-obj:not(.alfa){mix-blend-mode:screen}
.sv-obj:not(.alfa) .sv-obj-giro img{-webkit-mask:radial-gradient(closest-side,#000 72%,transparent);mask:radial-gradient(closest-side,#000 72%,transparent);filter:none}
.sv-obj-suelo{position:absolute;left:22%;right:22%;bottom:2%;height:7%;border-radius:50%;background:radial-gradient(closest-side,rgb(124 77 255 / .55),transparent);filter:blur(8px);animation:sv-sombra 7s ease-in-out infinite}
@keyframes sv-flota{0%,100%{transform:translate3d(0,-1.5%,40px) rotate(-1.5deg)}50%{transform:translate3d(0,2%,40px) rotate(1.5deg)}}
@keyframes sv-sombra{0%,100%{transform:scaleX(.9);opacity:.7}50%{transform:scaleX(1.05);opacity:1}}
@keyframes sv-respira{0%,100%{opacity:.75;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
@media (prefers-reduced-motion:reduce){.sv-obj-giro img,.sv-obj-suelo,.sv-obj-halo{animation:none}.sv-obj-giro{transition:none;transform:none}}

/* ---------- 2 · qué incluye ---------- */
.sv-incluye-rej{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.sv-pieza{position:relative;display:flex;flex-direction:column;gap:12px;min-height:250px;padding:28px;border:1px solid var(--linea);border-radius:var(--radio);
  background:linear-gradient(180deg,rgb(255 255 255 / .035),rgb(255 255 255 / .01)),rgb(11 11 14 / .72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);overflow:hidden;
  transition:transform .4s var(--suave),border-color .3s}
.sv-pieza:hover{transform:translateY(-4px);border-color:rgb(157 123 255 / .4)}
.sv-pieza .num{font:500 12px/1 var(--mono);color:var(--atenuado);letter-spacing:.1em}
.sv-pieza-ico{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;margin:auto 0 6px;color:#fff;
  background:linear-gradient(140deg,#8f63ff,#5b21f5);box-shadow:0 10px 26px -10px rgb(107 43 255 / .9),inset 0 1px 0 rgb(255 255 255 / .3)}
.sv-pieza-ico svg{width:20px;height:20px}
.sv-pieza h3{font-size:22px;letter-spacing:-.03em;line-height:1.15}
.sv-pieza p{color:#a9a8b3;font-size:15px;line-height:1.6}
.sv-pieza:first-child{background:radial-gradient(120% 80% at 100% 0%,rgb(107 43 255 / .4),transparent 60%),linear-gradient(180deg,rgb(255 255 255 / .04),rgb(255 255 255 / .01)),rgb(11 11 14 / .8)}

/* ---------- 3 · escenas ---------- */
.sv-escenas{padding-top:0}
.sv-escena{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(24px,5vw,72px);align-items:center;padding:28px 0}
.sv-escena.al-reves .sv-escena-img{order:2}
.sv-escena-img{margin:0;position:relative;border-radius:28px;overflow:hidden;aspect-ratio:3/2;
  background:radial-gradient(80% 90% at 50% 40%,rgb(107 43 255 / .28),transparent 70%),linear-gradient(180deg,#0d0b16,#050508);border:1px solid var(--linea-2)}
.sv-escena-img img{width:100%;height:100%;object-fit:contain;transition:transform 1.2s var(--suave)}
.sv-escena:hover .sv-escena-img img{transform:scale(1.04)}
.sv-escena h3{font-size:clamp(28px,2.8vw,42px);letter-spacing:-.04em;line-height:1.05;margin:18px 0 14px}
.sv-escena p{color:#bdbcc6;font-size:17px;max-width:28rem}
.sv-escena .fila-num{display:flex;align-items:center;gap:14px}

/* ---------- 4 · para quién (sobre el papel de «qh») ---------- */
main > .sv-para{margin-inline:clamp(12px,1.4vw,24px);border-radius:clamp(28px,2.6vw,40px)}
.sv-para-rej{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:center}
.sv-para-lista{display:grid;gap:14px}
.sv-para-pieza{display:grid;grid-template-columns:52px minmax(0,1fr);column-gap:18px;align-items:start;padding:26px 28px;min-height:0}
.sv-para-pieza .qh-num{grid-row:span 2;font-size:15px;color:#5b21d6;padding-top:6px}
.sv-para-pieza h3{margin:0 0 6px;font-size:clamp(19px,1.6vw,23px)}
.sv-para-pieza p{font-size:15px}

/* ---------- 6 · precio ---------- */
.sv-precio-caja{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);padding:clamp(28px,4vw,56px);border-radius:32px;overflow:hidden;isolation:isolate;
  background:radial-gradient(90% 120% at 0% 0%,rgb(107 43 255 / .35),transparent 55%),radial-gradient(70% 90% at 100% 100%,rgb(124 77 255 / .2),transparent 60%),rgb(10 9 16 / .82);
  border:1px solid rgb(157 123 255 / .28);box-shadow:0 40px 120px -50px rgb(107 43 255 / .7),inset 0 1px 0 rgb(255 255 255 / .08);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
@property --sv-ang{syntax:"<angle>";inherits:false;initial-value:0deg}
.sv-precio-caja::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;z-index:-1;pointer-events:none;
  background:conic-gradient(from var(--sv-ang),transparent 0 70%,#8f63ff 80%,#e9e2ff 84%,#8f63ff 88%,transparent 95%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:sv-giro 6s linear infinite}
@keyframes sv-giro{to{--sv-ang:360deg}}
@media (prefers-reduced-motion:reduce){.sv-precio-caja::before{animation:none}}
.sv-precio-cifra{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;margin:24px 0 8px}
.sv-precio-cifra b{font:700 clamp(54px,7vw,104px)/.95 var(--titular);letter-spacing:-.055em;color:#fff}
.sv-precio-cifra span{font-size:17px;color:#c4c3cd;max-width:18rem}
.sv-precio-modo{font:500 12px/1.4 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#9d7bff}
.sv-precio .acciones{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.sv-precio .hero-cta{min-height:56px;gap:18px;padding:0 6px 0 26px;background:linear-gradient(90deg,#6b2bff,#5a24e0);box-shadow:0 0 0 1px rgb(157 123 255 / .45),0 18px 44px -14px rgb(107 43 255 / .9)}
.sv-precio .hero-cta .circ{width:44px;height:44px;border-radius:50%;background:#14102a;display:grid;place-items:center}
.sv-precio .boton.borde{min-height:56px}
.sv-precio-nota{margin-top:22px;font-size:14px;color:#a9a8b3;max-width:30rem}
.sv-precio-nota a{color:#c9b8ff;text-decoration:underline;text-underline-offset:3px}
.sv-precio-der h2{font-size:clamp(26px,2.4vw,34px);letter-spacing:-.035em;margin:4px 0 22px}
.sv-entregables{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.sv-entregables li{display:flex;gap:14px;align-items:flex-start;padding:14px 0;border-bottom:1px solid rgb(255 255 255 / .08);font-size:16px;color:#e4e2ee}
.sv-entregables li:last-child{border-bottom:0}
.sv-entregables svg{flex:none;width:22px;height:22px;padding:3px;border-radius:50%;background:rgb(143 99 255 / .2);color:#c9b8ff;margin-top:1px}

/* ---------- 7 · preguntas ---------- */
.sv-faq-rej{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,80px);align-items:start}
.sv-faq-cab{position:sticky;top:120px}
.sv-faq-cab h2{font-size:clamp(36px,4.2vw,60px);letter-spacing:-.045em;margin:20px 0 20px}
.sv-faq-cab p{color:var(--atenuado);font-size:16px}
.sv-faq-cab p a{color:var(--acento);text-decoration:underline;text-underline-offset:3px}
.sv-faq-lista{display:grid;gap:12px}
.sv-preg{border:1px solid var(--linea);border-radius:18px;background:rgb(11 11 14 / .7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .3s,background .3s}
.sv-preg[open]{border-color:rgb(157 123 255 / .4);background:rgb(20 14 40 / .7)}
.sv-preg summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;cursor:pointer;font:600 clamp(17px,1.4vw,19px)/1.35 var(--titular);letter-spacing:-.015em}
.sv-preg summary::-webkit-details-marker{display:none}
.sv-preg summary i{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--linea-2);transition:transform .4s var(--suave),background .3s}
.sv-preg summary i svg{width:15px;height:15px}
.sv-preg[open] summary i{transform:rotate(45deg);background:var(--acento-relleno);border-color:var(--acento-relleno);color:#fff}
.sv-preg p{padding:0 24px 22px;color:#bdbcc6;font-size:16px;line-height:1.65;max-width:44rem}
.sv-preg summary:focus-visible{outline:2px solid var(--acento);outline-offset:2px;border-radius:18px}

/* ---------- 8 · tarjetas de servicio (relacionados e índice) ---------- */
.sv-grupo{padding-block:clamp(56px,7vw,96px) 0}
.sv-grupo + .sv-grupo{padding-top:clamp(40px,5vw,72px)}
.sv-grupo-cab{display:flex;flex-direction:column;gap:16px;margin-bottom:30px}
.sv-grupo-cab h2{font-size:clamp(30px,3.4vw,48px);letter-spacing:-.045em}
.sv-rejilla{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.sv-rejilla.tres{grid-template-columns:repeat(3,minmax(0,1fr))}
.sv-tarjeta{position:relative;display:flex;flex-direction:column;gap:10px;min-height:400px;padding:24px;border:1px solid var(--linea);border-radius:var(--radio);
  background:linear-gradient(180deg,rgb(255 255 255 / .03),rgb(255 255 255 / 0)),rgb(11 11 14 / .75);overflow:hidden;transition:transform .4s var(--suave),border-color .3s}
.sv-tarjeta:hover{transform:translateY(-4px);border-color:rgb(157 123 255 / .4)}
.sv-tarjeta .num{font:500 12px/1 var(--mono);color:var(--atenuado);letter-spacing:.1em;text-transform:uppercase}
.sv-tarjeta .ir{position:absolute;top:18px;right:18px;width:34px;height:34px;border-radius:50%;border:1px solid var(--linea-2);display:grid;place-items:center;transition:background .3s,transform .4s var(--suave)}
.sv-tarjeta .ir svg{width:14px;height:14px;transform:rotate(-45deg)}
.sv-tarjeta:hover .ir{background:var(--acento-relleno);border-color:var(--acento-relleno);color:#fff}
.sv-tarjeta-obj{flex:1;display:flex;align-items:center;justify-content:center;min-height:170px;margin:4px -6px}
.sv-tarjeta-obj img{width:min(200px,82%);height:auto;aspect-ratio:1;object-fit:contain;transition:transform .8s var(--suave),filter .6s;
  filter:drop-shadow(0 18px 26px rgb(60 20 160 / .35))}
.sv-tarjeta-obj:not(.alfa) img{mix-blend-mode:screen;-webkit-mask:radial-gradient(closest-side,#000 70%,transparent);mask:radial-gradient(closest-side,#000 70%,transparent);filter:none}
.sv-tarjeta:hover .sv-tarjeta-obj img{transform:scale(1.07) rotate(-3deg)}
.sv-tarjeta h3{font-size:21px;letter-spacing:-.025em;line-height:1.15}
.sv-tarjeta p{color:#a9a8b3;font-size:14.5px;line-height:1.55}
.sv-tarjeta-precio{margin-top:8px;padding-top:14px;border-top:1px solid var(--linea);font:600 14px/1.3 var(--titular);color:#c9b8ff}
.sv-todos{margin-top:34px;display:flex;justify-content:center}
.sv-todos .boton svg{width:14px;height:14px}

/* ---------- cierre del índice ---------- */
.sv-cierre-caja{text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px;padding-block:clamp(40px,6vw,80px)}
.sv-cierre h2{font-size:clamp(36px,5vw,72px);letter-spacing:-.05em;line-height:1}
.sv-cierre p{color:var(--atenuado);font-size:17px;max-width:34rem}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .sv-rejilla{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sv-incluye-rej{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .sv-hero{min-height:0;padding:130px 0 64px}
  .sv-hero-rej{grid-template-columns:1fr}
  .sv-obj{order:-1;width:min(70vw,360px);margin:-10px auto -20px}
  .sv-para-rej,.sv-faq-rej,.sv-precio-caja{grid-template-columns:1fr}
  .sv-faq-cab{position:static}
  .sv-escena,.sv-escena.al-reves{grid-template-columns:1fr}
  .sv-escena.al-reves .sv-escena-img{order:0}
  .sv-rejilla.tres{grid-template-columns:1fr}
}
@media (max-width:640px){
  .sv-hero h1{font-size:clamp(36px,10vw,52px)}
  .sv-miga [aria-current],.sv-miga span:nth-last-child(2){display:none}
  .sv-obj{width:min(62vw,300px)}
  .sv-incluye-rej,.sv-rejilla{grid-template-columns:1fr}
  .sv-pieza{min-height:0}
  .sv-tarjeta{min-height:0}
  .sv-tarjeta-obj{min-height:140px}
  .sv-datos{gap:14px 22px}
  .sv-para-pieza{grid-template-columns:1fr;padding:22px}
  .sv-para-pieza .qh-num{grid-row:auto;padding:0 0 8px}
  .sv-precio .acciones .boton{width:100%;justify-content:space-between}
  .sv-precio .boton.borde{justify-content:center}
  .sv-hero .acciones .boton{flex:1 1 auto}
}
/* (3-oct) ritmo en móvil: el objeto de cristal ya NO va encima del titular (lo empujaba a 3/4 de pantalla): va
   pequeño, arriba a la derecha y DETRÁS del texto; el titular y la llamada a la acción caben en la primera pantalla.
   Gana a «.hero{padding-top:300px!important}» de avantia.css (hueco del globo de la portada). */
@media (max-width:640px){
  .hero.sv-hero{padding-top:108px!important;padding-bottom:24px}
  .sv-hero-rej{position:relative}
  .sv-hero-txt{position:relative;z-index:1}
  .sv-obj{position:absolute;z-index:0;top:-14px;right:-12px;width:min(40vw,168px);margin:0;opacity:.9;pointer-events:none}
  .sv-obj-suelo{display:none}
  .sv-miga{margin-bottom:18px}
  .sv-h1-nombre{margin-bottom:14px;max-width:calc(100% - 120px)}
  .sv-hero h1{margin:14px 0 18px}
  .sv-hero .hero-lema{max-width:none}
  .sv-datos{margin-top:28px;padding-top:18px}
}
/* tema claro: las cintas del hero se funden con el papel en vez de cortar en seco (con el hero más bajo, el corte
   quedaba a media pantalla) */
html[data-tema="claro"] .sv-hero .cinta{-webkit-mask-image:linear-gradient(180deg,#000 62%,transparent);mask-image:linear-gradient(180deg,#000 62%,transparent)}

/* ════════════════════════════ tema claro ════════════════════════════ */
html[data-tema="claro"] .sv-hero h1{color:var(--c-tinta)}
html[data-tema="claro"] .sv-hero .cinta::after{background:none}
html[data-tema="claro"] .sv-hero h1 em,html[data-tema="claro"] .sv-pagina .cabeza h2 em,html[data-tema="claro"] .sv-faq-cab h2 em,
html[data-tema="claro"] .sv-cierre h2 em,html[data-tema="claro"] .cs-cab h2 em,html[data-tema="claro"] .sv-form-izq h2 em,html[data-tema="claro"] .gr-hero h1 em{background:var(--c-estela);-webkit-background-clip:text;background-clip:text;color:transparent;filter:none}
html[data-tema="claro"] .sv-miga,html[data-tema="claro"] .sv-datos dt{color:var(--c-tinta-3)}
html[data-tema="claro"] .sv-miga a{color:var(--c-tinta-2)}
html[data-tema="claro"] .sv-miga a:hover,html[data-tema="claro"] .sv-miga [aria-current]{color:var(--c-tinta)}
html[data-tema="claro"] .sv-datos{border-top-color:var(--c-filete)}
html[data-tema="claro"] .sv-datos dd{color:var(--c-tinta)}
html[data-tema="claro"] .sv-obj-halo{background:radial-gradient(closest-side,rgb(143 99 255 / .28),rgb(107 43 255 / .06) 55%,transparent)}
html[data-tema="claro"] .sv-obj-giro img{filter:drop-shadow(0 30px 40px rgb(60 20 160 / .28))}
html[data-tema="claro"] .sv-obj:not(.alfa){mix-blend-mode:multiply}
html[data-tema="claro"] .sv-obj:not(.alfa) .sv-obj-giro img{filter:none}
html[data-tema="claro"] .sv-obj:not(.alfa) .sv-obj-halo{opacity:.5}
html[data-tema="claro"] .sv-obj-suelo{background:radial-gradient(closest-side,rgb(60 20 160 / .3),transparent)}
html[data-tema="claro"] .sv-pieza,html[data-tema="claro"] .sv-tarjeta,html[data-tema="claro"] .sv-preg{background:var(--c-tarjeta);border-color:var(--c-filete);box-shadow:var(--c-sombra);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-tema="claro"] .sv-pieza:hover,html[data-tema="claro"] .sv-tarjeta:hover{border-color:rgb(107 43 255 / .28);box-shadow:var(--c-sombra-alta)}
html[data-tema="claro"] .sv-pieza:first-child{background:radial-gradient(120% 80% at 100% 0%,rgb(143 99 255 / .2),transparent 60%),#fff}
html[data-tema="claro"] .sv-pieza p,html[data-tema="claro"] .sv-tarjeta p,html[data-tema="claro"] .sv-preg p{color:var(--c-tinta-2)}
html[data-tema="claro"] .sv-pieza .num,html[data-tema="claro"] .sv-tarjeta .num{color:var(--c-num)}
html[data-tema="claro"] .sv-tarjeta-obj:not(.alfa) img{mix-blend-mode:multiply}
html[data-tema="claro"] .sv-tarjeta-obj img{filter:drop-shadow(0 14px 20px rgb(60 20 160 / .18))}
html[data-tema="claro"] .sv-tarjeta-obj:not(.alfa) img{filter:none}
html[data-tema="claro"] .sv-tarjeta-precio{color:#5b21d6;border-top-color:var(--c-filete)}
html[data-tema="claro"] .sv-tarjeta .ir,html[data-tema="claro"] .sv-preg summary i{border-color:var(--c-filete-2)}
html[data-tema="claro"] .sv-preg[open]{background:#fff;border-color:rgb(107 43 255 / .3)}
html[data-tema="claro"] .sv-preg[open] summary i{color:#fff}
html[data-tema="claro"] .sv-escena-img{background:radial-gradient(80% 90% at 50% 40%,rgb(143 99 255 / .16),transparent 70%),#fff;border-color:var(--c-filete);box-shadow:var(--c-sombra)}
html[data-tema="claro"] .sv-escena p{color:var(--c-tinta-2)}
html[data-tema="claro"] .sv-escena h3{color:var(--c-tinta)}
html[data-tema="claro"] .sv-precio-caja{background:radial-gradient(90% 120% at 0% 0%,rgb(143 99 255 / .16),transparent 55%),#fff;border-color:rgb(107 43 255 / .2);box-shadow:var(--c-sombra-alta)}
html[data-tema="claro"] .sv-precio-cifra b,html[data-tema="claro"] .sv-precio-der h2{color:var(--c-tinta)}
html[data-tema="claro"] .sv-precio-cifra span,html[data-tema="claro"] .sv-precio-nota{color:var(--c-tinta-2)}
html[data-tema="claro"] .sv-precio-modo{color:#5b21d6}
html[data-tema="claro"] .sv-precio-nota a{color:#5b21d6}
html[data-tema="claro"] .sv-entregables li{color:var(--c-tinta);border-bottom-color:var(--c-filete)}
html[data-tema="claro"] .sv-entregables svg{background:rgb(107 43 255 / .1);color:#5b21d6}
html[data-tema="claro"] .sv-faq-cab p,html[data-tema="claro"] .sv-cierre p{color:var(--c-tinta-2)}
html[data-tema="claro"] .sv-faq-cab p a{color:#5b21d6}
html[data-tema="claro"] .sv-precio .boton.borde{color:var(--c-tinta);background:#fff}

/* ---------- 6b · formulario propio (/crm, servicios/_formulario.php) — campos con las clases del modal «Hablemos» ---------- */
.sv-form{scroll-margin-top:90px}
.sv-form-caja{--ct-campo:rgb(255 255 255 / .04);--ct-campo-borde:#33333e;--ct-texto:#f3f2f7;--ct-suave:#bdbcc6;--ct-error:#ff8fa3;align-items:start;color:var(--ct-texto)}
.sv-form-izq h2{font-size:clamp(32px,3.4vw,52px);letter-spacing:-.045em;line-height:1.02;margin:18px 0 16px}
.sv-form-izq > p{color:#bdbcc6;font-size:16px;line-height:1.6;max-width:30rem;margin:0 0 22px}
.sv-form .ct-enviar{min-height:56px;gap:18px;padding:0 6px 0 26px;background:linear-gradient(90deg,#6b2bff,#5a24e0);box-shadow:0 0 0 1px rgb(157 123 255 / .45),0 18px 44px -14px rgb(107 43 255 / .9)}
.sv-form .ct-enviar .circ{width:44px;height:44px;border-radius:50%;background:#14102a;display:grid;place-items:center}
.sv-form-ok h3{font:700 clamp(28px,3vw,38px)/1.05 var(--titular);letter-spacing:-.04em;margin:6px 0 4px}
.sv-form-ok a:not(.boton){color:#c9b8ff;text-decoration:underline;text-underline-offset:3px}
@media (max-width:640px){.sv-form .ct-fila{grid-template-columns:1fr}.sv-form .ct-enviar{width:100%;justify-content:space-between}}
html[data-tema="claro"] .sv-form-caja{--ct-campo:#fff;--ct-campo-borde:rgb(24 16 48 / .18);--ct-texto:var(--c-tinta,#0c0c10);--ct-suave:var(--c-tinta-2,#3f3e4a);--ct-error:#c0263f}
html[data-tema="claro"] .sv-form-izq h2,html[data-tema="claro"] .sv-form-ok h3{color:var(--c-tinta)}
html[data-tema="claro"] .sv-form-izq > p{color:var(--c-tinta-2)}
html[data-tema="claro"] .sv-form-ok a:not(.boton){color:#5b21d6}
html[data-tema="claro"] .sv-form .ct-campo select option{background:#fff;color:#0c0c10}
html[data-tema="claro"] .sv-form .ct-check a{color:#5b21d6}
html[data-tema="claro"] .sv-form .boton.borde{color:var(--c-tinta);background:#fff}

/* ---------- /gracias (gracias.php) ---------- */
.gr-hero{min-height:auto;padding:clamp(150px,18vw,210px) 0 clamp(56px,7vw,96px)}
.gr-sello{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin-bottom:26px;background:var(--acento-relleno,#6b2bff);color:#fff;box-shadow:0 0 50px rgb(107 43 255 / .6)}
.gr-sello svg{width:30px;height:30px}
.gr-hero h1{max-width:16ch}
.gr-pasos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;list-style:none;margin:0;padding:0}
.gr-pasos li{position:relative;display:flex;flex-direction:column;gap:10px;padding:28px;border:1px solid var(--linea);border-radius:var(--radio);background:rgb(11 11 14 / .7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.gr-pasos b{font:500 12px/1 var(--mono);letter-spacing:.1em;color:var(--atenuado)}
.gr-pasos h3{margin:6px 0 0;font-size:clamp(19px,1.6vw,23px)}
.gr-pasos p{margin:0;color:#bdbcc6;font-size:15px;line-height:1.6}
@media (max-width:900px){.gr-pasos{grid-template-columns:1fr}}
html[data-tema="claro"] .gr-hero h1{color:var(--c-tinta)}
html[data-tema="claro"] .gr-pasos li{background:var(--c-tarjeta);border-color:var(--c-filete);box-shadow:var(--c-sombra);backdrop-filter:none;-webkit-backdrop-filter:none}
html[data-tema="claro"] .gr-pasos p{color:var(--c-tinta-2)}
html[data-tema="claro"] .gr-pasos b{color:var(--c-num)}

/* ════════════════════════════ /casos ════════════════════════════ */
.cs-indice{list-style:none;margin:40px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px;max-width:52rem}
.cs-indice a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:999px;border:1px solid rgb(255 255 255 / .14);background:rgb(255 255 255 / .04);
  font-size:14px;color:#e4e2ee;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .3s,background .3s}
.cs-indice a:hover{border-color:#9d7bff;background:rgb(157 123 255 / .12)}
.cs-lista{padding-top:clamp(40px,5vw,80px)}
.cs-caso{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(28px,5vw,80px);align-items:center;padding:clamp(40px,6vw,90px) 0;scroll-margin-top:110px}
.cs-caso + .cs-caso{border-top:1px solid var(--linea)}
.cs-caso.al-reves{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
.cs-caso.al-reves .cs-pantallas{order:2}
.cs-pantallas{position:relative;padding:0 9% 9% 0}
.cs-caso.al-reves .cs-pantallas{padding:0 0 9% 9%}
.cs-nav{margin:0;border-radius:16px;overflow:hidden;border:1px solid var(--linea-2);background:#0b0b0e;
  box-shadow:0 40px 100px -40px rgb(107 43 255 / .55),0 0 0 1px rgb(255 255 255 / .03);transform:perspective(1600px) rotateY(var(--cs-ry,-4deg)) rotateX(2deg);transition:transform .8s var(--suave)}
.cs-caso.al-reves .cs-nav{--cs-ry:4deg}
.cs-caso:hover .cs-nav{transform:perspective(1600px) rotateY(0) rotateX(0)}
.cs-nav-barra{display:flex;align-items:center;gap:6px;height:34px;padding:0 14px;background:#15141b;border-bottom:1px solid var(--linea)}
.cs-nav-barra i{width:9px;height:9px;border-radius:50%;background:#2e2d38}
.cs-nav-barra span{margin-left:12px;flex:1;max-width:280px;height:20px;border-radius:999px;background:#0b0b0e;font:500 11px/20px var(--mono);color:#8a8a93;padding-left:12px;overflow:hidden;white-space:nowrap}
.cs-nav img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.cs-movil{position:absolute;right:0;bottom:0;width:27%;margin:0;border-radius:26px;overflow:hidden;border:6px solid #16151c;background:#16151c;
  box-shadow:0 30px 60px -20px rgb(0 0 0 / .8),0 0 0 1px rgb(255 255 255 / .08);transform:translateY(0);transition:transform .8s var(--suave)}
.cs-caso.al-reves .cs-movil{right:auto;left:0}
.cs-caso:hover .cs-movil{transform:translateY(-10px)}
.cs-movil img{width:100%;height:auto;aspect-ratio:1/2;object-fit:cover;object-position:top;border-radius:20px}
.cs-txt .fila-num{display:flex;align-items:center;gap:14px}
.cs-sector{display:block;margin-top:20px;font:500 12px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--acento)}
.cs-txt h2{font-size:clamp(32px,3.4vw,50px);letter-spacing:-.045em;margin:12px 0 10px}
.cs-lema{font:600 clamp(18px,1.5vw,21px)/1.3 var(--titular);letter-spacing:-.015em;color:#d9d6e6;margin-bottom:16px}
.cs-lema em{font-style:normal;color:#b49cff}
.cs-txt > p:not(.cs-lema){color:#bdbcc6;font-size:16px;line-height:1.65;max-width:32rem}
.cs-hecho{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.cs-hecho li{padding:7px 12px;border-radius:999px;font-size:13px;color:#d9d6e6;background:rgb(143 99 255 / .14);border:1px solid rgb(157 123 255 / .25)}
.cs-acciones{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:28px}
.cs-serv{font-size:13.5px;color:#a9a8b3;text-decoration:underline;text-decoration-color:rgb(157 123 255 / .5);text-underline-offset:4px}
.cs-serv:hover{color:#fff}
.cs-mas-caja{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 64px;align-items:end;padding:clamp(28px,4vw,56px);border-radius:32px;
  border:1px solid var(--linea-2);background:radial-gradient(90% 120% at 100% 0%,rgb(107 43 255 / .3),transparent 60%),rgb(10 9 16 / .8)}
.cs-mas-caja h2{font-size:clamp(32px,3.6vw,54px);letter-spacing:-.045em;margin-top:18px}
.cs-mas-caja h2 em{font-style:normal;color:#b49cff}
.cs-mas-caja p{color:#bdbcc6;font-size:16px}
.cs-mas-caja .boton{justify-self:start}
@media (max-width:900px){
  .cs-caso,.cs-caso.al-reves{grid-template-columns:1fr}
  .cs-caso.al-reves .cs-pantallas{order:0;padding:0 9% 9% 0}
  .cs-caso.al-reves .cs-movil{left:auto;right:0}
  .cs-mas-caja{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.cs-nav,.cs-movil{transition:none;transform:none}.cs-caso:hover .cs-nav,.cs-caso:hover .cs-movil{transform:none}}
html[data-tema="claro"] .cs-indice a{color:var(--c-tinta);background:rgb(255 255 255 / .8);border-color:var(--c-filete-2)}
html[data-tema="claro"] .cs-nav{background:#fff;border-color:var(--c-filete);box-shadow:var(--c-sombra-alta)}
html[data-tema="claro"] .cs-nav-barra{background:#f4f2f8;border-bottom-color:var(--c-filete)}
html[data-tema="claro"] .cs-nav-barra i{background:#d9d5e6}
html[data-tema="claro"] .cs-nav-barra span{background:#fff;color:var(--c-tinta-3)}
html[data-tema="claro"] .cs-movil{border-color:#1b1a22;background:#1b1a22}
html[data-tema="claro"] .cs-sector{color:#5b21d6}
html[data-tema="claro"] .cs-txt h2{color:var(--c-tinta)}
html[data-tema="claro"] .cs-lema{color:var(--c-tinta-2)}
html[data-tema="claro"] .cs-lema em,html[data-tema="claro"] .cs-mas-caja h2 em{color:#5b21d6}
html[data-tema="claro"] .cs-txt > p:not(.cs-lema),html[data-tema="claro"] .cs-mas-caja p{color:var(--c-tinta-2)}
html[data-tema="claro"] .cs-hecho li{color:#2a1670;background:rgb(107 43 255 / .07);border-color:rgb(107 43 255 / .18)}
html[data-tema="claro"] .cs-serv{color:var(--c-tinta-2)}
html[data-tema="claro"] .cs-serv:hover{color:var(--c-tinta)}
html[data-tema="claro"] .cs-txt .boton.linea{color:var(--c-tinta);border-color:var(--c-filete-2)}
html[data-tema="claro"] .cs-mas-caja{background:radial-gradient(90% 120% at 100% 0%,rgb(143 99 255 / .14),transparent 60%),#fff;border-color:var(--c-filete);box-shadow:var(--c-sombra-alta)}
html[data-tema="claro"] .cs-mas-caja h2{color:var(--c-tinta)}

/* «Cómo trabajamos»: iconos claros en tema claro */
html[data-tema="claro"] img[src$="p-escucha.jpg"]{content:url(/img/p-escucha-claro.jpg)}html[data-tema="claro"] img[src$="p-propuesta.jpg"]{content:url(/img/p-propuesta-claro.jpg)}html[data-tema="claro"] img[src$="p-desarrollo.jpg"]{content:url(/img/p-desarrollo-claro.jpg)}html[data-tema="claro"] img[src$="p-entrega.jpg"]{content:url(/img/p-entrega-claro.jpg)}