/* LA WEB PÚBLICA DE BILDEIT (portada, páginas legales y 404).

   Es la propuesta aprobada (docs/web-propuesta/bildeit-web-ligera.html) pasada a su archivo, con
   todos los colores, tamaños de letra, espacios y radios como tokens de assets/css/tokens.css
   (sección «LA WEB PÚBLICA», --w-…), porque tests/diseno.test.js no deja escribirlos a mano aquí.
   Cambios sobre la propuesta: la entrada va solo con CSS (si el JS no carga, la página se ve),
   «aparecer al bajar» solo se activa cuando portada.js vigila, el día del calendario va en el
   acento (contraste AA), y no hay estilos en línea (la política de seguridad de _headers los
   bloquea). El panel NO carga este archivo. */

html{box-sizing:border-box}
*,*::before,*::after{box-sizing:inherit}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--w-e-76) + var(--seguro-arriba))}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--w-papel);color:var(--w-tinta);font-family:var(--w-sans);font-size:var(--w-t-17);line-height:1.55;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg{max-width:100%}
a{color:inherit}
:focus-visible{outline:2px solid var(--marca-naranja);outline-offset:3px;border-radius:var(--w-r-4)}
.envoltura{max-width:var(--w-ancho);margin:0 auto;padding:0 var(--w-e-28)}
.cifra{font-variant-numeric:tabular-nums}

/* ---------- Cabecera (como Plentia: suelta arriba, cápsula al bajar) ---------- */
.cabecera{position:fixed;top:0;left:0;right:0;z-index:50;padding:calc(var(--seguro-arriba) + var(--w-e-12)) var(--w-e-12) 0;pointer-events:none}
.cab-barra{pointer-events:auto;max-width:calc(var(--w-ancho) + 24px);margin:0 auto;display:flex;align-items:center;gap:var(--w-e-28);height:64px;padding:0 var(--w-e-10) 0 var(--w-e-20);border-radius:var(--w-r-18);border:1px solid transparent;background:transparent;transition:background var(--w-dur) var(--w-curva),border-color var(--w-dur) var(--w-curva),box-shadow var(--w-dur) var(--w-curva),max-width var(--w-dur) var(--w-curva)}
.cabecera.flotante .cab-barra{background:var(--w-cristal);-webkit-backdrop-filter:saturate(170%) blur(14px);backdrop-filter:saturate(170%) blur(14px);border-color:var(--w-linea);box-shadow:0 1px 0 var(--w-reflejo) inset,0 18px 36px -22px var(--w-sombra-cabecera);max-width:1080px}
.marca{display:inline-flex;align-items:center;color:var(--w-tinta);text-decoration:none;flex:none}
.marca svg{height:22px;width:auto;display:block}
.nav{display:flex;align-items:center;gap:2px;flex:1}
.nav > a, .desplegar{font:inherit;font-size:var(--w-t-15);font-weight:500;color:var(--w-tinta-2);background:none;border:0;padding:var(--w-e-8) var(--w-e-12);border-radius:var(--w-r-9);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:var(--w-e-6)}
.nav > a:hover,.desplegar:hover,.desplegar[aria-expanded="true"]{color:var(--w-tinta);background:var(--w-hover-nav)}
.desplegar svg{width:12px;height:12px;transition:transform var(--w-dur-corta) var(--w-curva)}
.desplegar[aria-expanded="true"] svg{transform:rotate(180deg)}
.grupo{position:relative}
.menu{position:absolute;top:calc(100% + 10px);left:0;min-width:300px;background:var(--w-papel);border:1px solid var(--w-linea);border-radius:var(--w-r-14);box-shadow:0 22px 44px -20px var(--w-sombra-menu);padding:var(--w-e-8);opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity var(--w-dur-corta) var(--w-curva),transform var(--w-dur-corta) var(--w-curva),visibility var(--w-dur-corta)}
.menu.abierto{opacity:1;visibility:visible;transform:none}
.menu a{display:block;padding:var(--w-e-10) var(--w-e-12);border-radius:var(--w-r-9);text-decoration:none}
.menu a:hover,.menu a:focus-visible{background:var(--w-hormigon)}
.menu a strong{display:block;font-size:var(--w-t-15);font-weight:600;color:var(--w-tinta)}
.menu a span{display:block;font-size:var(--w-t-13-5);color:var(--w-tinta-3);line-height:1.4}
.menu.idioma{left:auto;right:0;min-width:220px}
.menu .nota-menu{font-size:var(--w-t-13);color:var(--w-tinta-3);padding:var(--w-e-8) var(--w-e-12) var(--w-e-4);margin:0}
.menu .marcado{display:flex;justify-content:space-between;align-items:center}
.acciones{display:flex;align-items:center;gap:var(--w-e-6);margin-left:auto}
.boton{font:inherit;font-size:var(--w-t-15);font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:var(--w-e-8);height:44px;padding:0 var(--w-e-18);border-radius:var(--w-r-12);text-decoration:none;cursor:pointer;border:1px solid transparent;white-space:nowrap;transition:transform var(--w-dur-corta) var(--w-curva),box-shadow var(--w-dur-corta) var(--w-curva),background-color var(--w-dur-corta) var(--w-curva),color var(--w-dur-corta) var(--w-curva),border-color var(--w-dur-corta) var(--w-curva)}
.boton.principal{color:var(--w-blanco);background-color:var(--w-marca);border-color:var(--w-marca);box-shadow:0 8px 18px -10px var(--w-marca-sombra)}
/* El botón principal, igual en la web y en el panel (07/10/2026, punto 6.2): al pasar el ratón, fondo
   blanco con el texto y el borde en el naranja de la marca; en el móvil, lo mismo mientras se pulsa. */
@media (hover:hover){.boton.principal:hover{background-color:var(--w-blanco);color:var(--w-marca);border-color:var(--w-marca);box-shadow:none}}
.boton.principal:active{background-color:var(--w-blanco);color:var(--w-marca);border-color:var(--w-marca);box-shadow:none;transform:translateY(1px)}
.boton.oscuro{background:var(--w-tinta);color:var(--w-blanco)}
.boton.oscuro:hover{background:var(--w-negro)}
.boton.secundario{background:var(--w-papel);color:var(--w-tinta);border-color:var(--w-linea-fuerte)}
.boton.secundario:hover{border-color:var(--w-tinta)}
.boton.texto{background:none;color:var(--w-tinta-2);padding:0 var(--w-e-10)}
.boton.texto:hover{color:var(--w-tinta)}
.boton.grande{height:52px;padding:0 var(--w-e-26);font-size:16px;border-radius:var(--w-r-13)}
.hamburguesa{display:none;flex:none;background:var(--w-tinta);border:0;border-radius:var(--w-r-12);width:44px;height:44px;cursor:pointer;align-items:center;justify-content:center}
.hamburguesa span{display:block;width:18px;height:2px;background:var(--w-blanco);position:relative;border-radius:2px}
.hamburguesa span::before,.hamburguesa span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--w-blanco);border-radius:2px;transition:transform var(--w-dur-corta) var(--w-curva)}
.hamburguesa span::before{top:-6px}.hamburguesa span::after{top:6px}
.hamburguesa[aria-expanded="true"] span{background:transparent}
.hamburguesa[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.hamburguesa[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.solo-movil{display:none}
.movil{display:none}

@media (max-width: 920px){
  .nav,.acciones{display:none}
  .cab-barra{gap:var(--w-e-10);padding:0 var(--w-e-8) 0 16px}
  .solo-movil{display:inline-flex;margin-left:auto}
  .solo-movil .boton{height:44px;padding:0 16px}
  .hamburguesa{display:inline-flex}
  .movil{display:block;position:fixed;left:12px;right:12px;top:calc(var(--seguro-arriba) + 84px);z-index:49;background:var(--w-papel);border:1px solid var(--w-linea);border-radius:var(--w-r-18);box-shadow:0 24px 48px -24px var(--w-sombra-movil);padding:var(--w-e-8) var(--w-e-20) var(--w-e-20);max-height:calc(100% - 100px - var(--seguro-arriba) - var(--seguro-abajo));overflow:auto;transform:translateY(-6px);opacity:0;visibility:hidden;transition:opacity var(--w-dur-corta) var(--w-curva),transform var(--w-dur-corta) var(--w-curva),visibility var(--w-dur-corta)}
  .movil.abierto{transform:none;opacity:1;visibility:visible}
  .movil .movil-titulo{font-size:var(--w-t-13);color:var(--w-tinta-3);font-weight:500;margin:var(--w-e-18) 0 2px}
  .movil > a{display:block;padding:var(--w-e-12) 0;border-bottom:1px solid var(--w-linea);text-decoration:none;font-size:var(--w-t-17);font-weight:500}
  .movil .idiomas{display:flex;gap:var(--w-e-8);margin-top:var(--w-e-8)}
  .movil .idiomas a{border:1px solid var(--w-linea-fuerte);border-radius:var(--w-r-9);padding:var(--w-e-8) var(--w-e-14);font-size:var(--w-t-15);text-decoration:none}
  .movil .idiomas a[aria-current="true"]{border-color:var(--w-tinta)}
  .movil .botones-movil{display:grid;gap:var(--w-e-10);margin-top:var(--w-e-20)}
}

/* ---------- Entrada (como Opereit), solo con CSS: el logo letra a letra y el titular palabra a
   palabra, en menos de un segundo. La primera vez por sesión sale la cortina con el logo
   (sitio-arranque.js pone .sin-intro las demás veces). Si el JS no carga, todo se ve igual. ---------- */
:root{--inicio:.46s}
.sin-intro{--inicio:.06s}
.intro{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:radial-gradient(90% 60% at 50% 40%,var(--w-intro-brillo) 0%,var(--w-blanco) 70%);pointer-events:none;animation:intro-fuera var(--w-dur-corta) var(--w-curva) .4s forwards}
.sin-intro .intro{display:none}
.intro svg{width:min(260px,58vw);height:auto;color:var(--w-tinta);overflow:visible}
.intro .letra{transform-box:fill-box;opacity:0;transform:translateY(260px);filter:blur(10px);animation:letra .3s var(--w-curva) forwards;animation-delay:calc(var(--i) * 25ms)}
.intro .l1{--i:1}.intro .l2{--i:2}.intro .l3{--i:3}.intro .l4{--i:4}.intro .l5{--i:5}.intro .l6{--i:6}.intro .l0{--i:0}
@keyframes letra{to{opacity:1;transform:none;filter:blur(0)}}
@keyframes intro-fuera{to{opacity:0;visibility:hidden}}
@keyframes subir{from{opacity:0;filter:blur(12px);transform:translateY(14px)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes subir-suave{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes subir-demo{from{opacity:0;translate:0 60px}to{opacity:1;translate:0 0}}
@keyframes aparecer{from{opacity:0}to{opacity:1}}
.con-intro .cabecera{animation:aparecer var(--w-dur) var(--w-curva) var(--inicio) both}
.con-intro .palabra-h{display:inline-block;animation:subir var(--w-dur) var(--w-curva) both;animation-delay:calc(var(--inicio) + var(--d,0) * 30ms)}
.palabra-h.p1{--d:1}.palabra-h.p2{--d:2}.palabra-h.p3{--d:3}.palabra-h.p4{--d:4}.palabra-h.p5{--d:5}.palabra-h.p6{--d:6}.palabra-h.p7{--d:7}.palabra-h.p8{--d:8}
.con-intro .aparece{animation:subir-suave var(--w-dur) var(--w-curva) both;animation-delay:var(--inicio)}
.con-intro .aparece.d1{animation-delay:calc(var(--inicio) + 120ms)}
.con-intro .aparece.d2{animation-delay:calc(var(--inicio) + 160ms)}
.con-intro .aparece.d3{animation-delay:calc(var(--inicio) + 200ms)}
.con-intro .escaparate{animation:subir-demo var(--w-dur-larga) var(--w-curva) both;animation-delay:calc(var(--inicio) + 200ms)}
@media (prefers-reduced-motion: reduce){
  .intro{display:none}
  .con-intro .cabecera,.con-intro .palabra-h,.con-intro .aparece,.con-intro .escaparate{animation:none}
}
/* ---------- Secciones ---------- */
section{padding:var(--w-e-112) 0;position:relative}
section.gris{background:var(--w-hormigon)}
.cab-seccion{max-width:760px;margin-bottom:var(--w-e-56)}
.cab-seccion.centro{margin-left:auto;margin-right:auto;text-align:center}
.antetitulo{display:inline-flex;align-items:center;gap:var(--w-e-8);font-size:var(--w-t-14);font-weight:500;color:var(--w-naranja-oscuro);margin:0 0 var(--w-e-14)}
.antetitulo::before{content:"";width:6px;height:6px;border-radius:var(--w-r-circulo);background:var(--marca-naranja)}
h2.titulo{font-size:var(--w-t-h2);line-height:1.2;letter-spacing:-.05em;font-weight:400;margin:0 0 16px;text-wrap:balance}
.cab-seccion > p{font-size:var(--w-t-18-5);color:var(--w-tinta-2);margin:0;text-wrap:pretty}

/* widget base */
.widget{background:var(--w-papel);border:1px solid var(--w-linea);border-radius:var(--w-r-18);box-shadow:0 1px 2px var(--w-sombra-widget-1),0 24px 48px -32px var(--w-sombra-widget-2);overflow:hidden}
.widget-cab{display:flex;align-items:center;justify-content:space-between;gap:var(--w-e-12);padding:var(--w-e-14) var(--w-e-18);border-bottom:1px solid var(--w-linea);font-size:var(--w-t-13-5)}
.widget-cab strong{font-weight:600;font-size:var(--w-t-14)}
.widget-cab .gris-t{color:var(--w-tinta-3)}
.widget-cuerpo{padding:var(--w-e-18)}
.chip{display:inline-flex;align-items:center;gap:var(--w-e-6);font-size:var(--w-t-12-5);font-weight:500;padding:3px var(--w-e-9);border-radius:var(--w-r-999);border:1px solid var(--w-linea-fuerte);color:var(--w-tinta-2);background:var(--w-papel);white-space:nowrap}
.chip.vivo{color:var(--w-verde);border-color:var(--w-verde-borde);background:var(--w-verde-suave)}
.chip.vivo::before{content:"";width:6px;height:6px;border-radius:var(--w-r-circulo);background:var(--w-verde);box-shadow:0 0 0 3px var(--w-halo-verde)}
.chip.naranja{color:var(--w-naranja-oscuro);border-color:var(--w-naranja-borde);background:var(--w-naranja-suave)}
.chip.punto::before{content:"";width:6px;height:6px;border-radius:var(--w-r-circulo);background:currentColor}
.mono{font-family:var(--w-mono);font-variant-numeric:tabular-nums}
/* Aparecer al bajar: solo si portada.js está vigilando (si el JS no carga, todo se ve igual). */
.vigila .revela{opacity:0;transform:translateY(16px);transition:opacity var(--w-dur-larga) var(--w-curva),transform var(--w-dur-larga) var(--w-curva)}
.vigila .revela.visto{opacity:1;transform:none}
.revela.d90{transition-delay:90ms}
.revela.d180{transition-delay:180ms}
.fuente{font-size:var(--w-t-13);color:var(--w-tinta-3)}
.fuente a{color:var(--w-tinta-3)}
.marcas{list-style:none;margin:0;padding:0;display:grid;gap:var(--w-e-12)}
.marcas li{display:flex;gap:var(--w-e-12);font-size:16px;color:var(--w-tinta)}
.marcas li::before{content:"";flex:none;width:20px;height:20px;border-radius:var(--w-r-6);margin-top:2px;background:var(--w-naranja-suave) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%23B8401D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/16px no-repeat}
.tabla{width:100%;border-collapse:collapse;font-size:var(--w-t-14)}
.tabla th{text-align:left;font-weight:500;color:var(--w-tinta-3);font-size:var(--w-t-12-5);padding:var(--w-e-10) var(--w-e-14);background:var(--w-hormigon);border-bottom:1px solid var(--w-linea)}
.tabla td{padding:var(--w-e-11) var(--w-e-14);border-bottom:1px solid var(--w-linea);vertical-align:middle}
.tabla tr:last-child td{border-bottom:0}
.tabla .der{text-align:right;font-family:var(--w-mono);font-size:var(--w-t-13-5);white-space:nowrap}
.tabla tfoot td{font-weight:600;background:var(--w-gris-claro);border-top:1px solid var(--w-linea)}
.si,.no,.parte{display:inline-flex;width:24px;height:24px;border-radius:var(--w-r-7);align-items:center;justify-content:center}
.si{background:var(--w-verde-suave);color:var(--w-verde)}
.no{background:var(--w-hormigon);color:var(--w-tinta-3)}
.parte{background:var(--w-naranja-suave);color:var(--w-naranja-oscuro);width:auto;padding:0 var(--w-e-8);font-size:var(--w-t-12);font-weight:500}
.si svg,.no svg{width:13px;height:13px}
.ver-tabla{margin-top:var(--w-e-18)}
.ver-tabla summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:var(--w-e-8);font-weight:600;font-size:var(--w-t-15);padding:var(--w-e-10) 0}
.ver-tabla summary::-webkit-details-marker{display:none}
.ver-tabla summary::after{content:"";width:8px;height:8px;border-right:2px solid var(--w-tinta);border-bottom:2px solid var(--w-tinta);transform:rotate(45deg) translateY(-2px);transition:transform var(--w-dur-corta) var(--w-curva)}
.ver-tabla[open] summary::after{transform:rotate(-135deg)}
/* preguntas */
.faq{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:var(--w-e-72);align-items:start}
.faq .cab-seccion{position:sticky;top:110px;margin:0}
details.pregunta{border:1px solid var(--w-linea);border-radius:16px;background:var(--w-papel);margin-bottom:var(--w-e-10)}
details.pregunta[open]{border-color:var(--w-linea-fuerte)}
details.pregunta summary{list-style:none;cursor:pointer;padding:var(--w-e-20) var(--w-e-56) var(--w-e-20) var(--w-e-22);font-size:var(--w-t-17);font-weight:600;position:relative}
details.pregunta summary::-webkit-details-marker{display:none}
details.pregunta summary::after{content:"";position:absolute;right:20px;top:50%;width:26px;height:26px;margin-top:var(--w-e-menos-13);border-radius:var(--w-r-8);background:var(--w-hormigon) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M10 5v10M5 10h10' fill='none' stroke='%23151515' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center/14px no-repeat;transition:transform var(--w-dur-corta) var(--w-curva)}
details.pregunta[open] summary::after{transform:rotate(45deg)}
details.pregunta p{margin:0;padding:0 var(--w-e-22) var(--w-e-20);color:var(--w-tinta-2);font-size:16px;max-width:62ch}

/* contacto */
.contacto{background:var(--w-tinta);color:var(--w-blanco);overflow:hidden}
.contacto::before{content:"";position:absolute;width:720px;height:720px;right:-220px;top:-260px;background:radial-gradient(circle,var(--w-resplandor) 0%,var(--w-resplandor-0) 62%);pointer-events:none}
.contacto .envoltura{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:var(--w-e-72);align-items:center;position:relative}
.contacto h2{font-size:var(--w-t-clamp-5);line-height:1.04;letter-spacing:-.04em;font-weight:500;margin:0 0 16px}
.contacto .entr{color:var(--w-tinta-sobre-oscuro);font-size:var(--w-t-18);margin:0 0 var(--w-e-26);max-width:28em}
.contacto .marcas li{color:var(--w-blanco)}
.contacto .marcas li::before{background-color:var(--w-blanco-10);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%23FF9D4D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.formulario{background:var(--w-papel);color:var(--w-tinta);border-radius:var(--w-r-22);padding:var(--w-e-28);display:grid;gap:var(--w-e-14);box-shadow:0 40px 80px -40px var(--w-sombra-formulario)}
.formulario h3{margin:0 0 2px;font-size:var(--w-t-20);font-weight:600;letter-spacing:-.02em}
.formulario .doble{display:grid;grid-template-columns:1fr 1fr;gap:var(--w-e-12)}
.formulario label{display:grid;gap:var(--w-e-6);font-size:var(--w-t-13-5);font-weight:500;color:var(--w-tinta-2)}
.formulario input,.formulario select,.formulario textarea{font:inherit;font-size:var(--w-t-15);color:var(--w-tinta);border:1px solid var(--w-linea-fuerte);border-radius:var(--w-r-11);padding:var(--w-e-11) var(--w-e-12);background:var(--w-blanco);width:100%}
.formulario textarea{min-height:84px;resize:vertical}
.formulario input:focus,.formulario select:focus,.formulario textarea:focus{outline:2px solid var(--marca-naranja);outline-offset:1px;border-color:transparent}
.formulario .legal{font-size:var(--w-t-12-5);color:var(--w-tinta-3);margin:0}
.formulario .ok{display:none;font-size:var(--w-t-14);color:var(--w-verde);background:var(--w-verde-suave);border:1px solid var(--w-verde-borde);border-radius:var(--w-r-10);padding:var(--w-e-10) var(--w-e-12)}
.formulario.enviado .ok{display:block}

/* pie */
.pie{padding:var(--w-e-72) 0 0;font-size:var(--w-t-15);overflow:hidden}
.pie-arriba{display:grid;grid-template-columns:1.4fr repeat(4,1fr);gap:var(--w-e-36)}
.pie-arriba .pie-titulo{font-size:var(--w-t-13-5);color:var(--w-tinta-3);font-weight:500;margin:0 0 var(--w-e-14)}
.pie-arriba a{display:block;text-decoration:none;color:var(--w-tinta-2);padding:var(--w-e-5) 0}
.pie-arriba a:hover{color:var(--w-tinta)}
.pie-marca svg{height:22px;width:auto;color:var(--w-tinta)}
.pie-marca p{color:var(--w-tinta-2);font-size:var(--w-t-15);max-width:26ch;margin:16px 0 var(--w-e-20)}
.pie-legal{margin-top:var(--w-e-56);padding:var(--w-e-22) 0;border-top:1px solid var(--w-linea);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--w-tinta-3);font-size:var(--w-t-13-5)}
.pie-gigante{color:var(--w-pie-gigante);margin:var(--w-e-12) auto var(--w-e-menos-2-2pc);line-height:0;max-width:var(--w-ancho);padding:0 var(--w-e-28)}
.pie-gigante svg{width:100%;height:auto;display:block}
/* ---------- Añadidos a la propuesta (07/10/2026) ---------- */
.saltar{position:absolute;left:var(--w-e-12);top:var(--w-e-menos-80);z-index:200;background:var(--w-tinta);color:var(--w-blanco);padding:var(--w-e-10) var(--w-e-14);border-radius:var(--w-r-10);text-decoration:none}
.saltar:focus{top:var(--w-e-12)}
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mono,.cifra{font-family:var(--w-mono);font-variant-numeric:tabular-nums}
h1 .palabra-h{white-space:nowrap}
.pie-legal a{color:inherit}
/* el formulario */
.formulario .trampa{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.formulario .acepto{display:flex;gap:var(--w-e-10);align-items:flex-start;font-weight:400}
.formulario .acepto input{width:auto;margin-top:var(--w-e-4);accent-color:var(--marca)}
.formulario .acepto a{color:var(--w-tinta)}
.formulario [aria-invalid="true"]{border-color:var(--marca)}
.formulario .aviso-form{margin:0;font-size:var(--w-t-14)}
.formulario .aviso-form:empty{display:none}
.formulario .aviso-form.ok{color:var(--w-verde);background:var(--w-verde-suave);border:1px solid var(--w-verde-borde);border-radius:var(--w-r-10);padding:var(--w-e-10) var(--w-e-12)}
.formulario .aviso-form.mal{color:var(--w-naranja-oscuro);background:var(--w-naranja-suave);border:1px solid var(--w-naranja-borde);border-radius:var(--w-r-10);padding:var(--w-e-10) var(--w-e-12)}
.formulario.enviado .boton{opacity:.6;pointer-events:none}
.formulario button[disabled]{opacity:.6;cursor:progress}
/* las páginas legales y la 404 */
.pagina-legal,.no-encontrada{padding:calc(var(--seguro-arriba) + var(--w-e-120)) 0 var(--w-e-80)}
.estrecha{max-width:820px}
.pagina-legal h1,.no-encontrada h1{font-size:var(--w-t-clamp-3);margin:0 0 var(--w-e-12);max-width:none;text-align:left}
.pagina-legal .borrador{display:inline-block;font-size:var(--w-t-13-5);font-weight:600;color:var(--w-naranja-oscuro);background:var(--w-naranja-suave);border:1px solid var(--w-naranja-borde);border-radius:var(--w-r-999);padding:var(--w-e-4) var(--w-e-12);margin:0 0 var(--w-e-14)}
.pagina-legal .actualizada{color:var(--w-tinta-3);font-size:var(--w-t-14);margin:0 0 var(--w-e-28)}
.pagina-legal h2{font-size:var(--w-t-22);letter-spacing:-.02em;font-weight:600;margin:var(--w-e-36) 0 var(--w-e-10)}
.pagina-legal h3{font-size:var(--w-t-17);font-weight:600;margin:var(--w-e-22) 0 var(--w-e-8)}
.pagina-legal p,.pagina-legal li{color:var(--w-tinta-2)}
.pagina-legal a{color:var(--w-naranja-oscuro)}
.pagina-legal ul{padding-left:var(--w-e-22)}
.pagina-legal li{margin-bottom:var(--w-e-6)}
.pagina-legal .pendiente{background:var(--w-naranja-suave);color:var(--w-tinta);padding:0 var(--w-e-4);border-radius:var(--w-r-4)}
.pagina-legal table{width:100%;border-collapse:collapse;font-size:var(--w-t-15);margin:var(--w-e-12) 0}
.pagina-legal th{text-align:left;font-weight:600;color:var(--w-tinta);border-bottom:1px solid var(--w-linea-fuerte);padding:var(--w-e-8) var(--w-e-10)}
.pagina-legal td{border-bottom:1px solid var(--w-linea);padding:var(--w-e-8) var(--w-e-10);vertical-align:top;color:var(--w-tinta-2)}
.pagina-legal code{font-family:var(--w-mono);font-size:var(--w-t-14)}
.pagina-legal .tabla-legal{overflow-x:auto}
.no-encontrada p{color:var(--w-tinta-2)}

.sin-scroll{overflow:hidden}
.no-encontrada .botones{margin:var(--w-e-28) 0}
.casilla{min-width:0;overflow-wrap:anywhere}
.casillas{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width: 760px){.casillas{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.si,.no{position:relative}


/* =====================================================================================
   PORTADA (encargo del 07/10/2026): el panel de verdad (la demo a 1280 px y fotos de sus
   pantallas), rótulos en minúscula, una curva y dos duraciones para todo el movimiento.
   Medidas de las referencias en docs/web-referencias.md.
   ===================================================================================== */
section{padding:var(--w-e-120) 0}
.envoltura{padding:0 var(--w-e-40)}
.envoltura.ancha{max-width:var(--w-ancho-guia)}
.cab-seccion{margin-bottom:var(--w-e-64)}
.cab-seccion > p{font-size:var(--w-t-18);line-height:1.45;letter-spacing:-.01em;max-width:34em}
.cab-seccion.centro > p{margin-left:auto;margin-right:auto}
/* Los rótulos de sección: la letra de la web, en minúscula normal y sin separar letras (punto 2.2) */
.antetitulo{font-family:var(--w-sans);font-size:var(--w-t-15);font-weight:500;text-transform:none;letter-spacing:-.01em;color:var(--w-naranja-oscuro)}

/* ---------- Portada: blanco con luz difusa del naranja de la marca ---------- */
.portada{padding:calc(var(--seguro-arriba) + var(--w-e-150)) 0 0;position:relative;overflow:hidden;text-align:center;background:
  radial-gradient(60% 46% at 22% 8%,var(--w-luz-1) 0%,var(--w-luz-0) 100%),
  radial-gradient(54% 42% at 82% 18%,var(--w-luz-2) 0%,var(--w-luz-0) 100%),
  radial-gradient(70% 50% at 50% 70%,var(--w-luz-2) 0%,var(--w-luz-0) 100%),
  var(--w-blanco)}
.portada .texto-portada{max-width:960px;margin:0 auto;padding:0 var(--w-e-24)}
.para-quien{font-size:var(--w-t-14-5);color:var(--w-tinta-2);margin:0 0 var(--w-e-28);display:inline-flex;align-items:center;gap:var(--w-e-10);background:var(--w-cristal-2);border:1px solid var(--w-linea);border-radius:var(--w-r-999);padding:var(--w-e-7) 16px var(--w-e-7) var(--w-e-12)}
.para-quien::before{content:"";width:8px;height:8px;border-radius:var(--w-r-circulo);background:var(--marca-naranja);box-shadow:0 0 0 4px var(--w-halo-naranja)}
h1{font-size:var(--w-t-h1);line-height:1.1;letter-spacing:-.05em;font-weight:300;margin:0 auto var(--w-e-24);max-width:14ch;text-wrap:balance}
.entradilla{font-size:var(--w-t-clamp-2);line-height:1.45;letter-spacing:-.01em;color:var(--w-tinta-2);max-width:34em;margin:0 auto var(--w-e-36);text-wrap:pretty}
.botones{display:flex;flex-wrap:wrap;gap:var(--w-e-12);align-items:center}
.portada .botones{justify-content:center}
.letra-pequena{font-size:var(--w-t-14);color:var(--w-tinta-3);margin:16px 0 0}

/* El escaparate: el panel pintado a 1280 × 800 y escalado al ancho del marco (portada.js) */
.escaparate{max-width:1240px;margin:var(--w-e-72) auto 0;padding:0 var(--w-e-24) var(--w-e-80);position:relative}
.marco-envoltura{position:relative;perspective:1600px}
.marco{background:linear-gradient(180deg,var(--w-blanco) 0%,var(--w-marco-fondo) 100%);border:1px solid var(--w-linea-fuerte);border-radius:var(--w-r-22);padding:var(--w-e-12);box-shadow:0 -1px 0 var(--w-blanco) inset,0 40px 80px -40px var(--w-sombra-marco);text-align:left;transform-origin:50% 0;will-change:transform}
.marco-barra{display:flex;align-items:center;gap:var(--w-e-7);padding:var(--w-e-4) var(--w-e-6) var(--w-e-12)}
.marco-barra i{width:10px;height:10px;border-radius:var(--w-r-circulo);background:var(--w-punto-ventana)}
.marco-barra span{margin-left:var(--w-e-12);font-size:var(--w-t-12-5);color:var(--w-tinta-3);font-family:var(--w-mono)}
.pantalla-panel{position:relative;aspect-ratio:1280/800;border-radius:var(--w-r-14);overflow:hidden;border:1px solid var(--w-linea);background:var(--w-gris-claro);cursor:pointer}
.pantalla-panel.cargada{cursor:auto}
.pantalla-panel .demo-foto{display:block;width:100%;height:100%;object-fit:cover;object-position:top left}
.pantalla-panel iframe{position:absolute;left:0;top:0;width:1280px;height:800px;border:0;transform-origin:0 0;opacity:0;transition:opacity var(--w-dur) var(--w-curva);background:var(--w-gris-claro)}
.pantalla-panel.cargada iframe{opacity:1}
.demo-estado{position:absolute;left:50%;bottom:var(--w-e-24);transform:translateX(-50%);margin:0;font-size:var(--w-t-14);color:var(--w-tinta-2);background:var(--w-cristal);border:1px solid var(--w-linea);border-radius:var(--w-r-999);padding:var(--w-e-8) var(--w-e-14)}
.demo-estado:empty{display:none}
/* En el móvil el panel es una vista previa: una pastilla pequeña dentro del marco abre la demo entera */
.abrir-tactil{display:none}
.demo-enlace{margin:var(--w-e-24) 0 0;text-align:center;font-size:var(--w-t-15)}
.demo-enlace a{color:var(--w-tinta-2);text-decoration:none;border-bottom:1px solid var(--w-linea-fuerte);padding-bottom:2px;transition:color var(--w-dur-corta) var(--w-curva),border-color var(--w-dur-corta) var(--w-curva)}
.demo-enlace a:hover{color:var(--w-marca);border-color:var(--w-marca)}
.demo-pantalla{position:fixed;inset:0;z-index:120;display:flex;flex-direction:column;background:var(--w-papel);padding-top:var(--seguro-arriba)}
.demo-pantalla .salir-demo{display:flex;justify-content:space-between;align-items:center;gap:var(--w-e-12);padding:var(--w-e-8) var(--w-e-12);border-bottom:1px solid var(--w-linea)}
.demo-pantalla .salir-demo span{font-size:var(--w-t-14);color:var(--w-tinta-3)}
.demo-pantalla .salir-demo .boton{height:40px;padding:0 var(--w-e-14)}
.demo-pantalla iframe{flex:1;width:100%;border:0}

/* ---------- Barra de abajo en el móvil ---------- */
.barra-cta{display:none}
@media (max-width: 760px){
  .barra-cta{display:grid;grid-template-columns:1fr 1fr auto;gap:var(--w-e-8);align-items:center;position:fixed;left:var(--w-e-12);right:var(--w-e-12);bottom:calc(var(--w-e-12) + env(safe-area-inset-bottom, 0px));z-index:45;background:var(--w-cristal);-webkit-backdrop-filter:saturate(170%) blur(14px);backdrop-filter:saturate(170%) blur(14px);border:1px solid var(--w-linea);border-radius:var(--w-r-18);padding:var(--w-e-8);box-shadow:0 18px 40px -18px var(--w-sombra-cta);transform:translateY(calc(100% + 40px));opacity:0;visibility:hidden;transition:transform var(--w-dur) var(--w-curva),opacity var(--w-dur) var(--w-curva),visibility var(--w-dur)}
  .barra-cta.ver{transform:none;opacity:1;visibility:visible}
  .barra-cta .boton{height:44px;padding:0 var(--w-e-10);font-size:var(--w-t-14-5)}
  .cerrar-cta{width:44px;height:44px;border:0;border-radius:var(--w-r-12);background:none;color:var(--w-tinta-2);display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
  .cerrar-cta svg{width:16px;height:16px}
  body.con-barra .pie{padding-bottom:var(--w-e-80)}
}

/* ---------- Para quién es, en oscuro ---------- */
section.oscura{background:var(--w-noche);color:var(--w-blanco);padding:var(--w-e-140) 0}
.oscura .antetitulo{color:var(--w-noche-cifra)}
.oscura .frase{font-size:var(--w-t-frase);line-height:1.08;letter-spacing:-.05em;font-weight:300;margin:0 0 var(--w-e-96);max-width:18ch;text-wrap:balance}
.cifra-heroe{display:grid;justify-content:start;grid-template-columns:auto minmax(0,30em);gap:var(--w-e-40);align-items:end;padding-bottom:var(--w-e-56);border-bottom:1px solid var(--w-noche-linea)}
.cifra-heroe .numero{font-size:var(--w-t-numero);line-height:.82;letter-spacing:-.06em;font-weight:300;color:var(--w-noche-cifra);font-variant-numeric:tabular-nums}
.cifra-heroe p{margin:0 0 var(--w-e-12);font-size:var(--w-t-18);line-height:1.45;color:var(--w-blanco)}
.cifra-heroe .fuente,.cifra-heroe .fuente a{color:var(--w-noche-texto);font-size:var(--w-t-14);line-height:1.5}
.hechos{list-style:none;margin:0;padding:var(--w-e-48) 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--w-e-40)}
.hechos strong{display:block;font-size:var(--w-t-20);font-weight:400;letter-spacing:-.02em;margin-bottom:var(--w-e-8)}
.hechos span{display:block;color:var(--w-noche-texto);font-size:var(--w-t-15-5);line-height:1.5}

/* ---------- Fotos del panel con sus marcas (posiciones en fotos-panel.css) ---------- */
.foto-panel{position:relative;margin:0;overflow:hidden;border-radius:var(--w-r-12);background:var(--w-gris-claro)}
.foto-panel img{display:block;width:100%;height:auto}
.foto-panel .marca{position:absolute;border:2px solid var(--marca-naranja);border-radius:var(--w-r-8);box-shadow:0 0 0 4px var(--w-halo-naranja);pointer-events:none}
.foto-panel .pildora{position:absolute;right:var(--w-e-menos-6);top:0;transform:translateY(-60%);white-space:nowrap;background:var(--w-marca);color:var(--w-blanco);font-size:var(--w-t-12-5);font-weight:600;line-height:1.2;padding:var(--w-e-5) var(--w-e-10);border-radius:var(--w-r-999);box-shadow:0 6px 16px -6px var(--w-marca-sombra)}
.foto-panel .marca.izq .pildora{right:calc(100% + 10px);top:50%;transform:translateY(-50%)}

/* ---------- «Así va una certificación» ---------- */
.guia{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:var(--w-e-56);align-items:start}
.pasos{list-style:none;margin:0;padding:0}
.paso{min-height:64vh;display:flex;flex-direction:column;justify-content:center;padding:var(--w-e-32) 0 var(--w-e-32) var(--w-e-24);border-left:2px solid var(--w-linea);transition:border-color var(--w-dur) var(--w-curva),opacity var(--w-dur) var(--w-curva)}
.paso:first-child{min-height:48vh;justify-content:flex-start;padding-top:var(--w-e-56)}
.guia.guiada .paso{opacity:.42}
.guia.guiada .paso.activo{opacity:1;border-left-color:var(--marca-naranja)}
.paso .num{font-family:var(--w-mono);font-size:var(--w-t-13);color:var(--w-naranja-oscuro);margin-bottom:var(--w-e-10)}
.paso h3{font-size:var(--w-t-h3);line-height:1.2;letter-spacing:-.02em;font-weight:400;margin:0 0 var(--w-e-12)}
.paso p{margin:0;color:var(--w-tinta-2);font-size:var(--w-t-16);line-height:1.5}
.paso .foto-panel.v-movil{display:none}
.desliza{display:none;margin:var(--w-e-12) 0 0;font-size:var(--w-t-14);color:var(--w-tinta-3)}
.guia-pantalla{position:sticky;top:calc(var(--seguro-arriba) + 96px)}
.guia-marco{position:relative;aspect-ratio:1280/1024;max-height:calc(100vh - 128px);border-radius:var(--w-r-22);border:1px solid var(--w-linea-fuerte);background:linear-gradient(180deg,var(--w-blanco) 0%,var(--w-marco-fondo) 100%);padding:var(--w-e-10);box-shadow:0 40px 80px -48px var(--w-sombra-guia)}
.guia-marco .foto-panel{position:absolute;inset:var(--w-e-10);opacity:0;transition:opacity var(--w-dur) var(--w-curva)}
.guia-marco .foto-panel.activa{opacity:1}
.guia-marco .foto-panel .marca{opacity:0;transform:scale(.98);transition:opacity var(--w-dur) var(--w-curva),transform var(--w-dur) var(--w-curva)}
.guia-marco .foto-panel.activa .marca{opacity:1;transform:none;transition-delay:var(--w-dur-corta)}
.guia-marco .foto-panel.activa .marca.m2{transition-delay:var(--w-dur)}

/* ---------- Qué hace: bento con fotos del panel ---------- */
.bento{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--w-e-20)}
.caja-b{grid-column:span 2;background:var(--w-papel);border-radius:var(--w-r-16);overflow:hidden;display:flex;flex-direction:column}
.caja-b.ancha{grid-column:span 3}
.pieza{height:300px;background:var(--w-hormigon);margin:var(--w-e-8) var(--w-e-8) 0;border-radius:var(--w-r-12);padding:var(--w-e-20) var(--w-e-20) 0;overflow:hidden}
.pieza picture,.pieza img{display:block;width:100%}
.pieza img{border-radius:var(--w-r-8) var(--w-r-8) 0 0;box-shadow:0 1px 2px var(--w-sombra-widget-1),0 16px 32px -24px var(--w-sombra-widget-2);transform:translateY(var(--w-e-8));transition:transform var(--w-dur-larga) var(--w-curva)}
.vigila .caja-b.revela.visto .pieza img{transform:none}
.caja-texto{padding:var(--w-e-24) var(--w-e-28) var(--w-e-28)}
.caja-texto h3{font-size:var(--w-t-h3);line-height:1.2;letter-spacing:-.02em;font-weight:400;margin:0 0 var(--w-e-8)}
.caja-texto p{margin:0;color:var(--w-tinta-2);font-size:var(--w-t-16);line-height:1.45;max-width:34em}

/* ---------- Conexiones: diagrama en el ordenador; en el móvil, bildeit arriba y una lista enlazada ---------- */
.red{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:var(--w-e-28) var(--w-e-40);max-width:980px;margin:0 auto}
.red .nodos{display:contents;list-style:none;margin:0;padding:0}
.red-lineas{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.red-lineas path{fill:none;stroke:var(--w-linea-fuerte);stroke-width:1.5;stroke-dasharray:4 6;vector-effect:non-scaling-stroke}
.nodo{position:relative;z-index:1;display:flex;gap:var(--w-e-12);align-items:flex-start;align-self:center;background:var(--w-papel);border:1px solid var(--w-linea);border-radius:var(--w-r-16);padding:var(--w-e-16) var(--w-e-18)}
.nodo svg{flex:none;width:22px;height:22px;color:var(--w-tinta);margin-top:2px}
.nodo strong{display:block;font-weight:500;font-size:var(--w-t-16)}
.nodo small{display:block;color:var(--w-tinta-3);font-size:var(--w-t-13-5);line-height:1.4}
.nodo .sentido{display:inline-block;font-size:var(--w-t-12-5);font-weight:500;color:var(--w-naranja-oscuro);margin-bottom:2px}
.nodo.centro{grid-column:2;grid-row:2;justify-self:center;align-items:center;justify-content:center;background:var(--w-tinta);color:var(--w-blanco);border-color:var(--w-tinta);padding:var(--w-e-22) var(--w-e-32);box-shadow:0 0 0 10px var(--w-halo-naranja)}
.nodo-marca svg{height:26px;width:auto;display:block;color:var(--w-blanco);margin:0}
.n1{grid-column:1;grid-row:1}.n2{grid-column:3;grid-row:1}.n3{grid-column:1;grid-row:2}.n4{grid-column:3;grid-row:2}.n5{grid-column:2;grid-row:3}
.vigila .red.revela .nodo:not(.centro){opacity:0;transform:translateY(8px);transition:opacity var(--w-dur) var(--w-curva),transform var(--w-dur) var(--w-curva)}
.vigila .red.revela.visto .nodo{opacity:1;transform:none}
.red.visto .n2{transition-delay:50ms}.red.visto .n3{transition-delay:100ms}.red.visto .n4{transition-delay:150ms}.red.visto .n5{transition-delay:200ms}

/* ---------- Verifactu ---------- */
.vf{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--w-e-20)}
.tarjeta{border:0;border-radius:var(--w-r-16);padding:var(--w-e-32);background:var(--w-papel)}
.tarjeta h3{font-size:var(--w-t-h3);margin:0 0 var(--w-e-12);letter-spacing:-.02em;font-weight:400}
.tarjeta p{color:var(--w-tinta-2);margin:0 0 var(--w-e-12);font-size:var(--w-t-16)}
.fechas{list-style:none;padding:0;margin:0 0 var(--w-e-14)}
.fechas li{display:flex;gap:16px;padding:var(--w-e-12) 0;border-bottom:1px solid var(--w-linea);font-size:var(--w-t-16)}
.fechas li strong{font-family:var(--w-mono);font-weight:500;min-width:7.2em}
.cadena{grid-column:1/-1;background:var(--w-papel);border-radius:var(--w-r-16);padding:var(--w-e-32)}
.cadena-cab{display:flex;flex-wrap:wrap;gap:var(--w-e-6) var(--w-e-20);align-items:baseline;margin-bottom:var(--w-e-28)}
.cadena-cab strong{font-weight:400;font-size:var(--w-t-20);letter-spacing:-.02em}
.cadena-cab span{color:var(--w-tinta-2);font-size:var(--w-t-15)}
.eslabones{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--w-e-48)}
.eslabon{border:1px solid var(--w-linea);border-radius:var(--w-r-14);padding:var(--w-e-16);font-size:var(--w-t-13-5);position:relative;background:var(--w-gris-claro)}
.eslabon + .eslabon::before{content:"";position:absolute;left:-49px;top:50%;width:48px;height:2px;background:var(--marca-naranja);transform-origin:0 50%}
.eslabon strong{display:block;font-size:var(--w-t-16);font-weight:500;margin-bottom:var(--w-e-8)}
.eslabon code{display:block;font-family:var(--w-mono);font-size:var(--w-t-12-5);color:var(--w-tinta-2);word-break:break-all;line-height:1.6}
.eslabon code em{font-style:normal;color:var(--w-naranja-oscuro)}
.sello-vf{float:right;font-size:var(--w-t-12);font-weight:500;color:var(--w-verde);background:var(--w-verde-suave);border:1px solid var(--w-verde-borde);border-radius:var(--w-r-999);padding:0 var(--w-e-8)}
.vigila .cadena.revela .eslabon{opacity:0;transform:translateY(8px);transition:opacity var(--w-dur) var(--w-curva),transform var(--w-dur) var(--w-curva)}
.vigila .cadena.revela .eslabon + .eslabon::before{transform:scaleX(0);transition:transform var(--w-dur) var(--w-curva)}
.vigila .cadena.revela.visto .eslabon{opacity:1;transform:none}
.vigila .cadena.revela.visto .eslabon + .eslabon::before{transform:none}
.cadena.visto .eslabon:nth-child(2){transition-delay:100ms}.cadena.visto .eslabon:nth-child(2)::before{transition-delay:50ms}
.cadena.visto .eslabon:nth-child(3){transition-delay:200ms}.cadena.visto .eslabon:nth-child(3)::before{transition-delay:150ms}
.nota-cadena{margin:var(--w-e-20) 0 0}

/* ---------- Comparativas: tabla con aire, cabecera fija y la columna de bildeit en tinta ---------- */
.comparativa,.tabla-planes{background:var(--w-papel);border:1px solid var(--w-linea);border-radius:var(--w-r-16)}
.comparativa table,.tabla-planes table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--w-t-15)}
.comparativa thead th,.tabla-planes thead th{position:sticky;top:calc(var(--seguro-arriba) + 84px);z-index:2;background:var(--w-papel);font-size:var(--w-t-14);font-weight:500;color:var(--w-tinta-3);text-align:center;padding:var(--w-e-22) var(--w-e-16);border-bottom:1px solid var(--w-linea);vertical-align:bottom}
.comparativa thead th:first-child,.tabla-planes thead th:first-child{text-align:left;padding-left:var(--w-e-28);border-top-left-radius:var(--w-r-16)}
.comparativa thead th:last-child,.tabla-planes thead th:last-child{border-top-right-radius:var(--w-r-16)}
.comparativa tbody th,.tabla-planes tbody th{text-align:left;font-weight:500;padding:var(--w-e-22) var(--w-e-16) var(--w-e-22) var(--w-e-28)}
.comparativa td,.tabla-planes td{padding:var(--w-e-22) var(--w-e-16);text-align:center}
.comparativa tbody tr + tr > *,.tabla-planes tbody tr + tr > *{border-top:1px solid var(--w-linea)}
.comparativa .nuestro{background:var(--w-tinta);color:var(--w-blanco)}
.comparativa thead th.nuestro{background:var(--w-tinta);color:var(--w-blanco);font-weight:600;font-size:var(--w-t-15)}
.comparativa tbody tr + tr > td.nuestro{border-top-color:var(--w-noche-linea)}
.comparativa tbody tr:last-child td.nuestro{border-bottom-right-radius:var(--w-r-16)}
.comparativa .nuestro .si,.comparativa .nuestro .parte{background:var(--w-noche-2);color:var(--w-noche-cifra)}
.tabla-planes td{color:var(--w-tinta-2)}
.col-m{display:none}

/* ---------- Precios (sin cifras hasta que se confirmen; web/precios.json) ---------- */
.planes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--w-e-20);align-items:stretch}
.plan{border-radius:var(--w-r-16);padding:var(--w-e-32);display:flex;flex-direction:column;background:var(--w-papel);position:relative}
.plan.destacado{background:var(--w-tinta);color:var(--w-blanco)}
.plan .insignia{position:absolute;top:var(--w-e-28);right:var(--w-e-28);background:var(--w-noche-2);color:var(--w-noche-cifra);font-size:var(--w-t-12-5);font-weight:500;padding:var(--w-e-4) var(--w-e-10);border-radius:var(--w-r-999)}
.plan h3{font-size:var(--w-t-h3);margin:0;font-weight:400;letter-spacing:-.02em}
.plan .para{color:var(--w-tinta-3);font-size:var(--w-t-15);margin:var(--w-e-6) 0 var(--w-e-28);min-height:2.9em}
.plan.destacado .para,.plan.destacado .precio span{color:var(--w-noche-texto)}
.plan .precio{display:flex;flex-direction:column;gap:var(--w-e-4);margin:0}
.plan .precio strong{font-size:var(--w-t-30);font-weight:400;letter-spacing:-.03em;line-height:1.1}
.plan .precio span{font-size:var(--w-t-15);color:var(--w-tinta-3)}
.plan .limites{list-style:none;margin:var(--w-e-24) 0;padding:var(--w-e-16) 0;border-top:1px solid var(--w-linea);border-bottom:1px solid var(--w-linea);display:grid;gap:var(--w-e-8);font-size:var(--w-t-15);color:var(--w-tinta)}
.plan.destacado .limites{border-color:var(--w-noche-linea);color:var(--w-blanco)}
.plan .boton{width:100%}
.plan .incluye{list-style:none;padding:0;margin:var(--w-e-24) 0 0;display:grid;gap:var(--w-e-11);font-size:var(--w-t-15)}
.plan li{position:relative}
.plan .incluye li{padding-left:var(--w-e-28)}
.plan .incluye li::before{content:"";position:absolute;left:0;top:2px;width:18px;height:18px;border-radius:var(--w-r-6);background:var(--w-hormigon) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%23151515' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
.plan.destacado .incluye li::before{background-color:var(--w-noche-2);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-7' fill='none' stroke='%23FF9D4D' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E")}
.incluido{margin-top:var(--w-e-20);border-radius:var(--w-r-16);padding:var(--w-e-28) var(--w-e-32);background:var(--w-papel)}
.incluido h3{margin:0 0 var(--w-e-16);font-size:var(--w-t-16);font-weight:500}
.incluido ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--w-e-12) var(--w-e-24);font-size:var(--w-t-15);color:var(--w-tinta-2)}
.incluido li{display:flex;gap:var(--w-e-10);align-items:flex-start}
.incluido li svg{flex:none;width:18px;height:18px;padding:2px;border-radius:var(--w-r-6);background:var(--w-naranja-suave);color:var(--w-naranja-oscuro);margin-top:2px}
.puesta{margin-top:var(--w-e-20);display:flex;justify-content:space-between;align-items:center;gap:var(--w-e-28);border:1px dashed var(--w-linea-fuerte);border-radius:var(--w-r-16);padding:var(--w-e-28) var(--w-e-32)}
.puesta h3{margin:0 0 var(--w-e-6);font-size:var(--w-t-20);font-weight:400;letter-spacing:-.02em}
.puesta p{margin:0;color:var(--w-tinta-2);font-size:var(--w-t-15);max-width:44em}
.ver-tabla{margin-top:var(--w-e-24)}
.ver-tabla .tabla-planes{margin-top:var(--w-e-12)}
.ambito{margin:var(--w-e-28) auto 0;max-width:52em;text-align:center;font-size:var(--w-t-15);color:var(--w-tinta-2)}
.ambito strong{color:var(--w-tinta);font-weight:500}

/* ---------- Preguntas: se abren con la altura animada y sin perder las esquinas ---------- */
details.pregunta{border:0;border-radius:var(--w-r-16);background:var(--w-hormigon);overflow:hidden;margin-bottom:var(--w-e-10)}
details.pregunta summary{font-weight:500}
details.pregunta summary::after{background-color:var(--w-papel)}
details.pregunta .respuesta p{margin:0;padding:0 var(--w-e-22) var(--w-e-20);color:var(--w-tinta-2);font-size:var(--w-t-16);max-width:62ch}
details .respuesta{overflow:hidden}
.contacto h2{font-size:var(--w-t-h2);line-height:1.15;letter-spacing:-.05em;font-weight:300}
.formulario{border-radius:var(--w-r-16)}
.formulario h3{font-weight:500}

/* ---------- El idioma: selector en el pie y aviso si el navegador prefiere el otro ---------- */
.idioma-pie{display:inline-flex;gap:var(--w-e-4);background:var(--w-hormigon);border-radius:var(--w-r-999);padding:3px}
.idioma-pie a{display:inline-flex;gap:var(--w-e-6);align-items:center;text-decoration:none;color:var(--w-tinta-2);font-size:var(--w-t-13-5);font-weight:600;padding:var(--w-e-5) var(--w-e-12);border-radius:var(--w-r-999);transition:background-color var(--w-dur-corta) var(--w-curva),color var(--w-dur-corta) var(--w-curva)}
.idioma-pie a span{font-weight:400}
.idioma-pie a[aria-current="true"]{background:var(--w-papel);color:var(--w-tinta);box-shadow:0 1px 2px var(--w-sombra-segmento)}
.aviso-idioma{position:fixed;left:var(--w-e-16);bottom:var(--w-e-16);z-index:60;display:flex;align-items:center;gap:var(--w-e-8);background:var(--w-tinta);color:var(--w-blanco);border-radius:var(--w-r-14);padding:var(--w-e-8) var(--w-e-8) var(--w-e-8) var(--w-e-14);font-size:var(--w-t-14);box-shadow:0 18px 40px -18px var(--w-sombra-cta);transition:opacity var(--w-dur) var(--w-curva),transform var(--w-dur) var(--w-curva)}
.aviso-idioma[hidden]{display:none}
.aviso-idioma a{color:var(--w-blanco);font-weight:600}
.aviso-idioma button{width:32px;height:32px;border:0;border-radius:var(--w-r-9);background:var(--w-noche-2);color:var(--w-blanco);cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.aviso-idioma button svg{width:14px;height:14px}

/* ---------- Responsive ---------- */
@media (max-width: 1100px){
  .guia{display:block}
  .guia .guia-pantalla{display:none}
  .guia.guiada .paso{opacity:1}
}
@media (max-width: 1020px){
  .hechos{grid-template-columns:1fr;gap:var(--w-e-24)}
  .cifra-heroe{grid-template-columns:1fr;gap:var(--w-e-20)}
  .bento{grid-template-columns:1fr}
  .caja-b,.caja-b.ancha{grid-column:auto}
  .vf{grid-template-columns:1fr}
  .planes{grid-template-columns:1fr;max-width:560px;margin:0 auto}
  .incluido ul{grid-template-columns:repeat(2,minmax(0,1fr))}
  .faq,.contacto .envoltura{grid-template-columns:1fr;gap:var(--w-e-44)}
  .faq .cab-seccion{position:static}
  .pie-arriba{grid-template-columns:repeat(2,1fr)}
  .pie-marca{grid-column:1/-1}
}
@media (max-width: 1100px){
  /* En el móvil y la tableta: cada paso es una tarjeta a ancho completo con su foto del panel en el
     móvil; se pasan de lado y no bloquean el scroll de la página */
  .pasos{display:grid;grid-auto-flow:column;grid-auto-columns:100%;align-items:start;gap:var(--w-e-12);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 var(--w-e-40);padding:0 var(--w-e-40) var(--w-e-12);margin:0 var(--w-e-menos-40);scrollbar-width:none;overscroll-behavior-x:contain}
  .pasos::-webkit-scrollbar{display:none}
  .paso,.paso:first-child{min-height:0;opacity:1;border:1px solid var(--w-linea);border-radius:var(--w-r-16);background:var(--w-papel);padding:var(--w-e-20) var(--w-e-20) 0;display:flex;flex-direction:column;justify-content:flex-start;scroll-snap-align:start;overflow:hidden}
  .paso h3{font-size:var(--w-t-20)}
  .paso p{font-size:var(--w-t-16)}
  /* la foto del panel en el móvil, de borde a borde de la tarjeta, casi a su tamaño real */
  .paso .foto-panel.v-movil{display:block;margin:var(--w-e-16) var(--w-e-menos-20) 0;border-radius:0;border-top:1px solid var(--w-linea)}
  .desliza{display:block}
  .guia.guiada .paso.activo{border-left-color:var(--w-linea)}
}
@media (max-width: 760px){
  body{font-size:var(--w-t-16)}
  .envoltura{padding:0 var(--w-e-20)}
  section{padding:var(--w-e-60) 0}
  section.oscura{padding:var(--w-e-80) 0}
  .cab-seccion{margin-bottom:var(--w-e-40)}
  .cab-seccion > p{font-size:var(--w-t-17)}
  .portada{padding-top:calc(var(--seguro-arriba) + var(--w-e-120))}
  .escaparate{padding:0 var(--w-e-12) var(--w-e-56);margin-top:var(--w-e-44)}
  .marco{padding:var(--w-e-6);border-radius:var(--w-r-18)}
  .marco-barra{display:none}
  .pantalla-panel{border-radius:var(--w-r-12)}
  .abrir-tactil{display:inline-flex;position:absolute;right:var(--w-e-10);bottom:var(--w-e-10);z-index:2;font:inherit;font-size:var(--w-t-13-5);font-weight:600;color:var(--w-blanco);background:var(--w-tinta);border:0;border-radius:var(--w-r-999);padding:var(--w-e-8) var(--w-e-14);box-shadow:0 8px 20px -8px var(--w-sombra-cta)}
  .demo-enlace{display:none}
  .para-quien{font-size:var(--w-t-13);white-space:nowrap;padding:var(--w-e-6) var(--w-e-14) var(--w-e-6) var(--w-e-10)}
  .oscura .frase{margin-bottom:var(--w-e-56)}
  .pasos{padding:0 var(--w-e-20) var(--w-e-12);margin:0 var(--w-e-menos-20);scroll-padding:0 var(--w-e-20)}
  .pieza{height:auto;max-height:360px;padding:var(--w-e-12) var(--w-e-12) 0}
  .caja-texto{padding:var(--w-e-20)}
  /* Conexiones en el móvil: bildeit arriba y cada conexión colgando de una línea vertical, con su punto */
  .red{display:block;max-width:420px}
  .red-lineas{display:none}
  .nodo.centro{display:flex;width:fit-content;margin:0 auto var(--w-e-28);box-shadow:0 0 0 8px var(--w-halo-naranja)}
  .red .nodos{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--w-e-12);position:relative;padding-left:var(--w-e-28)}
  .red .nodo,.n1,.n2,.n3,.n4,.n5{grid-column:1;grid-row:auto}
  .red .nodos::before{content:"";position:absolute;left:var(--w-e-10);top:var(--w-e-menos-28);bottom:var(--w-e-28);width:2px;background:var(--w-linea-fuerte)}
  .red .nodo:not(.centro)::before{content:"";position:absolute;left:var(--w-e-menos-22);top:50%;width:10px;height:10px;margin-top:var(--w-e-menos-5);border-radius:var(--w-r-circulo);background:var(--w-papel);border:2px solid var(--marca-naranja)}
  .tarjeta,.cadena{padding:var(--w-e-22)}
  .eslabones{grid-template-columns:1fr;gap:var(--w-e-28)}
  .eslabon + .eslabon::before{left:50%;top:-29px;width:2px;height:28px;transform-origin:50% 0}
  .vigila .cadena.revela .eslabon + .eslabon::before{transform:scaleY(0)}
  /* las comparativas, en fichas: una por fila, con la columna de bildeit destacada */
  .comparativa,.tabla-planes{background:none;border:0;border-radius:0}
  .comparativa thead,.tabla-planes thead{display:none}
  .comparativa table,.comparativa tbody,.comparativa tr,.comparativa td,.comparativa tbody th,
  .tabla-planes table,.tabla-planes tbody,.tabla-planes tr,.tabla-planes td,.tabla-planes tbody th{display:block;width:auto}
  .comparativa tr,.tabla-planes tr{background:var(--w-papel);border:1px solid var(--w-linea);border-radius:var(--w-r-16);margin-bottom:var(--w-e-12);overflow:hidden}
  .comparativa tbody tr + tr > *,.tabla-planes tbody tr + tr > *{border-top:0}
  .comparativa tbody th,.tabla-planes tbody th{padding:var(--w-e-16) var(--w-e-16) var(--w-e-10);font-size:var(--w-t-16)}
  .comparativa td,.tabla-planes td{display:flex;justify-content:space-between;align-items:center;gap:var(--w-e-12);text-align:right;padding:var(--w-e-10) var(--w-e-16);border-top:1px solid var(--w-linea)}
  .comparativa td.nuestro{border-top-color:var(--w-tinta)}
  .comparativa tbody tr:last-child td.nuestro{border-radius:0}
  .col-m{display:inline;color:var(--w-tinta-3);font-size:var(--w-t-14);text-align:left}
  .comparativa td.nuestro .col-m{color:var(--w-blanco);font-weight:600}
  .plan,.incluido,.puesta{padding:var(--w-e-24)}
  .incluido ul{grid-template-columns:1fr}
  .puesta{flex-direction:column;align-items:flex-start}
  .ambito{text-align:left}
  .formulario .doble{grid-template-columns:1fr}
  .tabla td,.tabla th{padding:var(--w-e-10)}
  .tabla td:first-child{white-space:normal}
  .aviso-idioma{left:var(--w-e-12);right:var(--w-e-12);bottom:auto;top:calc(var(--seguro-arriba) + 84px)}
}
@media (prefers-reduced-motion: reduce){
  .guia.guiada .paso{opacity:1}
  .guia-marco .foto-panel .marca{opacity:1;transform:none}
}

/* ---------- Páginas legales: BORRADOR bien visible, cada [PENDIENTE: dato] resaltado y la norma de
   cada apartado debajo, en pequeño ---------- */
.pagina-legal .borrador{display:block;font-size:var(--w-t-14);font-weight:600;color:var(--w-tinta);background:var(--w-naranja-suave);border:1px solid var(--w-naranja-borde);border-left:4px solid var(--w-marca);border-radius:var(--w-r-8);padding:var(--w-e-10) var(--w-e-14);margin:0 0 var(--w-e-20)}
.pagina-legal .pendiente{background:var(--w-naranja-suave);color:var(--w-naranja-oscuro);font-weight:600;padding:0 var(--w-e-4);border-radius:var(--w-r-4);outline:1px dashed var(--w-naranja-borde)}
.pagina-legal .norma{font-size:var(--w-t-14);color:var(--w-tinta-3);border-left:2px solid var(--w-linea);padding-left:var(--w-e-12);margin-top:var(--w-e-12)}
.pagina-legal .norma a{color:var(--w-tinta-2)}
.formulario .legal a{color:var(--w-tinta-2)}
