/* Avantia · formulario «Hablemos» (modal). Lo monta assets/contacto.js. Oscuro por defecto, claro con html[data-tema="claro"].
   En el móvil ocupa la pantalla entera. */
.ct-dlg{
  --ct-fondo:rgb(14 12 24 / .94);--ct-borde:rgb(157 123 255 / .26);--ct-campo:rgb(255 255 255 / .04);--ct-campo-borde:#33333e;
  --ct-texto:#f3f2f7;--ct-suave:#bdbcc6;--ct-error:#ff8fa3;
  width:min(680px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0;border:0;background:transparent;color:var(--ct-texto);overflow:visible
}
.ct-dlg::backdrop{background:rgb(4 3 10 / .72);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.ct-dlg[open]{animation:ct-entra .38s var(--suave,cubic-bezier(.76,0,.24,1))}
.ct-dlg[open]::backdrop{animation:ct-fondo .3s ease-out}
@keyframes ct-entra{from{opacity:0;transform:translateY(18px) scale(.98)}}
@keyframes ct-fondo{from{opacity:0}}
html.ct-abierto{overflow:hidden}

.ct-caja{position:relative;max-height:calc(100dvh - 48px);overflow:auto;overscroll-behavior:contain;padding:clamp(26px,4vw,40px);border-radius:24px;
  background:radial-gradient(120% 70% at 100% 0,rgb(107 43 255 / .22),transparent 60%),var(--ct-fondo);border:1px solid var(--ct-borde);
  box-shadow:0 40px 120px -40px rgb(107 43 255 / .55),inset 0 1px 0 rgb(255 255 255 / .06);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.ct-cerrar{position:absolute;top:16px;right:16px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--ct-campo-borde);
  background:transparent;color:var(--ct-texto);cursor:pointer;transition:background .2s,border-color .2s}
.ct-cerrar svg{width:18px;height:18px}
.ct-cerrar:hover{border-color:var(--acento,#9d7bff);background:rgb(157 123 255 / .12)}

.ct-rotulo{font:500 12px/1 var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--acento,#9d7bff)}
.ct-dlg h2{margin:14px 0 10px;font:700 clamp(30px,4vw,42px)/1.02 var(--titular);letter-spacing:-.045em;color:var(--ct-texto)}
.ct-dlg h2 em{font:italic 400 1.08em/1 "Serif",Georgia,serif;letter-spacing:-.02em;color:#9d7bff}
.ct-intro{margin:0 0 24px;max-width:30rem;color:var(--ct-suave);font-size:15px;line-height:1.55;padding-right:40px}

.ct-form{display:flex;flex-direction:column;gap:14px}
.ct-fila{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ct-campo{display:flex;flex-direction:column;gap:7px;min-width:0}
.ct-campo > label{font:600 13px/1.2 "Inter",sans-serif;color:var(--ct-texto)}
.ct-campo > label small{font-weight:400;color:var(--ct-suave)}
.ct-campo input,.ct-campo select,.ct-campo textarea{width:100%;min-height:48px;padding:12px 14px;border-radius:12px;border:1px solid var(--ct-campo-borde);
  background:var(--ct-campo);color:var(--ct-texto);font:400 15px/1.4 "Inter",sans-serif;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.ct-campo select{padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%239d7bff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:16px}
.ct-campo select option{background:#14131c;color:#f3f2f7}
.ct-campo textarea{min-height:112px;resize:vertical}
.ct-campo input::placeholder,.ct-campo textarea::placeholder{color:#8a8a93}
.ct-campo input:focus,.ct-campo select:focus,.ct-campo textarea:focus{outline:none;border-color:var(--acento,#9d7bff);box-shadow:0 0 0 3px rgb(157 123 255 / .28)}
.ct-campo.mal input,.ct-campo.mal select,.ct-campo.mal textarea{border-color:var(--ct-error)}
.ct-err{margin:0;min-height:0;font-size:13px;line-height:1.35;color:var(--ct-error)}
.ct-err:empty{display:none}

.ct-check > label{display:flex;gap:12px;align-items:flex-start;font-weight:400;font-size:14px;line-height:1.5;color:var(--ct-suave);cursor:pointer}
.ct-check input{flex:none;width:22px;height:22px;min-height:0;padding:0;margin-top:1px;border-radius:6px;cursor:pointer;display:grid;place-items:center}
.ct-check input:checked{background:var(--acento-relleno,#6b2bff);border-color:var(--acento-relleno,#6b2bff)}
.ct-check input:checked::after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
.ct-check a{color:var(--acento,#9d7bff);text-decoration:underline;text-underline-offset:2px}

.ct-aviso{margin:2px 0 0;padding:12px 14px;border-radius:12px;border:1px solid rgb(255 143 163 / .35);background:rgb(255 143 163 / .08);color:var(--ct-error);font-size:14px}
.ct-enviar{align-self:flex-start;margin-top:6px;border:0;cursor:pointer;padding-right:8px}
.ct-enviar .circ{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgb(255 255 255 / .16)}
.ct-enviar[disabled]{opacity:.7;cursor:progress}
.ct-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}

.ct-ok{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:12px 0 4px;outline:none}
.ct-ok[hidden],.ct-form-zona[hidden]{display:none}
.ct-ok-ico{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;background:var(--acento-relleno,#6b2bff);color:#fff;box-shadow:0 0 40px rgb(107 43 255 / .6);margin-bottom:6px}
.ct-ok-ico svg{width:28px;height:28px}
.ct-ok p{margin:0 0 18px;color:var(--ct-suave);font-size:15px;line-height:1.55;max-width:32rem}
.ct-ok .boton{cursor:pointer;background:transparent}

/* tema claro */
html[data-tema="claro"] .ct-dlg{--ct-fondo:rgb(255 255 255 / .97);--ct-borde:rgb(24 16 48 / .1);--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"] .ct-dlg::backdrop{background:rgb(30 20 60 / .38)}
html[data-tema="claro"] .ct-caja{background:radial-gradient(120% 70% at 100% 0,rgb(107 43 255 / .09),transparent 60%),var(--ct-fondo);box-shadow:var(--c-sombra-alta,0 34px 80px -36px rgb(60 20 160 / .45))}
html[data-tema="claro"] .ct-rotulo,html[data-tema="claro"] .ct-check a{color:var(--c-violeta,#5b21d6)}
html[data-tema="claro"] .ct-dlg h2 em{color:#6b2bff}
html[data-tema="claro"] .ct-campo select option{background:#fff;color:#0c0c10}
html[data-tema="claro"] .ct-campo input::placeholder,html[data-tema="claro"] .ct-campo textarea::placeholder{color:#7a7a86}
html[data-tema="claro"] .ct-campo input:focus,html[data-tema="claro"] .ct-campo select:focus,html[data-tema="claro"] .ct-campo textarea:focus{border-color:#6b2bff;box-shadow:0 0 0 3px rgb(107 43 255 / .18)}
html[data-tema="claro"] .ct-aviso{background:rgb(192 38 63 / .06);border-color:rgb(192 38 63 / .3)}
html[data-tema="claro"] .ct-ok .boton.borde{color:var(--c-tinta,#0c0c10);border-color:var(--c-filete-2,rgb(24 16 48 / .15))}

/* móvil: pantalla entera */
@media (max-width:640px){
  .ct-dlg{width:100%;height:100%;max-height:none;margin:0;inset:0}
  .ct-caja{height:100%;max-height:none;border-radius:0;border:0;padding:22px 16px calc(28px + env(safe-area-inset-bottom))}
  .ct-cerrar{top:12px;right:12px}
  .ct-fila{grid-template-columns:1fr}
  .ct-dlg h2{font-size:32px;margin-top:12px}
  .ct-intro{padding-right:44px;margin-bottom:20px}
  .ct-enviar{align-self:stretch;justify-content:space-between}
  .ct-campo input,.ct-campo select,.ct-campo textarea{font-size:16px}   /* sin zoom automático de iOS */
}
@media (prefers-reduced-motion:reduce){.ct-dlg[open],.ct-dlg[open]::backdrop{animation:none}}

/* la flecha del bloque «¿Tienes un proyecto? Hablemos.» es un botón propio (abre el formulario) */
.pie2-mail .pie2-mail-txt{color:inherit;text-decoration:none}
button.circ[data-contacto-abrir]{border:0;padding:0;color:#fff;cursor:pointer;font:inherit}
.pie2-mail:hover .circ{transform:none}
.pie2-mail .circ[data-contacto-abrir]:hover,.pie2-mail .circ[data-contacto-abrir]:focus-visible{transform:rotate(-45deg)}
.pie2-mail .circ[data-contacto-abrir]:focus-visible{outline:2px solid var(--acento,#9d7bff);outline-offset:4px;border-radius:50%}
@media (prefers-reduced-motion:reduce){.pie2-mail .circ[data-contacto-abrir]:hover,.pie2-mail .circ[data-contacto-abrir]:focus-visible{transform:none}}
